jquery获取带有optgroup的select的选定元素为空

nhjlsmyf 于 2023-01-30 发布在 jQuery

关注(0)|答案(2)|浏览(139)

我有一个选择字段与optiongroup上的网站，将由 AJAX 填充.

<select id="wlistid" name="wlistid">
<optgroup label="My List"></optgroup>
<optgroup label="Brother List">
   <option value="5">First</option>
   <option value="8">Second</option>
</optgroup>
</select>

我使用这段代码来加载select：

$('#wlistid').load('ajax.php',{'ajaxcall':'getOptions');

该代码在页面加载时运行。
现在我想得到这个选择字段的选定元素。

$('select[name=wlistid]').on('change', function() {
                        var listid=$('#wlistid').children('option:selected').val();
                        alert('ID '+listid);
                    });

但它仍然是不确定的。
如果删除optgroup并将select更改为：

<select id="wlistid" name="wlistid">
       <option value="5">First</option>
       <option value="8">Second</option>
    </select>

上面的代码可以工作并警告正确的值。
但是我喜欢用optgroup，谁能帮忙？

jquery

来源：https://stackoverflow.com/questions/75233491/jquery-get-selected-element-of-select-with-optgroup-is-null

2条答案

按热度按时间

wfveoks01#

您的问题是由使用$("select").children("option")引起的-这将只找到"直接子项"。
由于您的option是optgroup的子级，因此您的代码找不到（任何）option。
如果您需要<option>而不仅仅是select的值，则可以改为使用.find来获取option：

$('#wlistid').find('option:selected');

更新片段：
x一个一个一个一个x一个一个二个x

赞(0）回复(0）举报 2023-01-30

4szc88ey2#

你把事情弄得太复杂了。
在这种情况下使用子项是不正确的，因为这些选项不是select的子项，而是optgroup的子项。
就这么做

$('#wlistid').on('change', function() {
  var listid = this.value
  console.log('ID', listid);
  // alternatives
  console.log('ID', $(this).val());
  console.log('ID', $("option:selected",this).val())
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="wlistid" name="wlistid">
  <optgroup label="My List"></optgroup>
  <optgroup label="Brother List">
    <option value="5">First</option>
    <option value="8">Second</option>
  </optgroup>
</select>

赞(0）回复(0）举报 2023-01-30

我来回答

jquery获取带有optgroup的select的选定元素为空

2条答案

相关问题

热门标签

最新问答