首页 > 解决方案 > 使用 JavaScript 获取下拉选择的名称

问题描述

我正在使用 JavaScript 将一些信息拉入列表中,但我不确定如何定位下拉选择。

这就是我用来获取选中单选按钮结果的方法:
RequestType: $("input[name=requestType]:checked").val(),

我如何能够使用相同的格式来获取下拉列表的选择?
SessionType:

标签: javascriptjquery

解决方案


您不需要在每次单击时调用该函数,通常只需一个更改事件的侦听器就足够了。如果您还想在其他时刻获取 select-input 的值,可以将选定的值保存在变量中或使用:selected-option 查询 input-selects。

$('#rChoices').on('change', function(event) {
  let value = event.target.value;
  console.log(value);
});

$('#btnGetValue').on('click', function(event) {
  let value = $('#rChoices option:selected').val();
  console.log(value);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group row rChoices">
  <label for="rChoices" class="col-form-label">Please choose a application below:</label>
  <select class="form-control" id="rChoices">
    <option class="" selected disabled>---------</option>
    <option value="onedrive" id="onedrive">OneDrive</option>
    <option value="teams" id="teams">Teams</option>
    <option value="outlook" id="outlook">Outlook</option>
    <option value="officesuite" id="officesuite">Office Suite</option>
    <option value="planner" id="planner">Planner</option>
    <option value="sharepoint" id="sharepoint">SharePoint</option>
    <option value="stream" id="stream">Stream</option>
    <option value="yammer" id="yammer">Yammer</option>
  </select>
  <div class="help-block with-errors"></div>
</div>

<button id="btnGetValue">Get Value</button>


推荐阅读