如何在jQuery中单击按钮时获取所选下拉值的值 [英] How to get value of selected dropdown value on button click in jquery

问题描述

我将Bootstrap与jquery一起使用来创建包含下拉菜单和按钮的动态表.我想获取按钮单击时在jquery中选择的下拉菜单的值.

I am using Bootstrap with jquery to create a dynamic table consisting dropdown menu and button. I want to get value of dropdown menu selected in jquery on button click.

下面是我的代码

<table class="table table-bordered">
  <tbody>
  {% for item in items %}
    <tr>
      <td>
        <div class="dropdown">
          <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            Select
          </button>
          <ul class="dropdown-menu" role="menu" id="options" onchange="selectFromDropDown(this.value)">
            <li><a id="weekly" selected>Option 1</a></li>
            <li><a id="biweekly">Option 2</a></li>
            <li><a id="monthly">Option 3</a></li>
          </ul>
        </div>
      </td>
      <td>
        <form data-toggle="validator" role="form" >
          <input type="submit" value="Update" class="btn btn-xs btn-block" id="update">
        </form>
      </td>
    </tr>
    {% endfor %}
  </tbody>
</table>

下面是jquery

$('#update').click(function(){
  alert($('#options option:selected').html())
});

当我在上面的代码中运行时，它返回"undefined".

When I run above code it returns "undefined".

推荐答案

如果您使用控件中的 select ，则无需担心.只需对您的代码做些改动即可.

If you are using select from control then no worry to code for it. Just do a little change in your code.

$('#update').click(function(){
  alert($('#options').val());
});

或者，如果您使用的是 ul，li ，则可以像这样更改您的jquery代码.

Or if you are using ul, li then change your jquery code like this.

$('#update').click(function(){
  alert($('#options .selected').text())
});

这篇关于如何在jQuery中单击按钮时获取所选下拉值的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！