如何使用jQuery选择'select'带有确定的选定选项的标记

How can I select using jQuery 'select' tag with determined selected option?

本文关键字:选项 jQuery 何使用 选择 select      更新时间:2023-09-26

例如

<div id="wrapper">
    <select>
        <option value="en" selected="selected">english</option>
        <option value="ar">العربية</option>
        <option value="az">azərbaycanlı</option>
        <option value="bg">български</option>
        <option value="ca">català</option>
        <option value="cs">český</option>
        <!-- some data cut -->
    </select>
<select>
        <option value="en" >english</option>
        <option value="ar">العربية</option>
        <option value="az" selected="selected">azərbaycanlı</option>
        <option value="bg">български</option>
        <option value="ca">català</option>
        <option value="cs">český</option>
        <!-- some data cut -->
    </select>
<select>
        <option value="en" >english</option>
        <option value="ar">العربية</option>
        <option value="az" selected="selected">azərbaycanlı</option>
        <option value="bg">български</option>
        <option value="ca">català</option>
        <option value="cs">český</option>
        <!-- some data cut -->
    </select>
</div>

如何用value="az"选择'select'标签

我已经找到了唯一的方法:

var val_ = "az";
    var selects = $div.find("select").filter(function(index_){
                var val0 = $(this).val();
                return val0 == val_;
            });

有没有更优雅的方法?

编辑。我的问题是关于'选择'标签。所有的问题在stackoverflow是关于子'选项'标签。

  1. 您可以使用属性=选择器 [attribute='value'] ,用于选择使用特定值
  2. 使用 :has() 选择器检查所选选项值
  3. :selected 获取选项的选择器

代码:

$('select:has(:selected[value="az"])')

使用变量可以

var val_ = "az";
var selects = $('select:has(:selected[value="' + val_ + '"])');

例如:

var val_ = "az";
$('select').change(function() {
  var selects = $('select:has(:selected[value="' + val_ + '"])');
  console.log(selects.length);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="wrapper">
  <select>
    <option value="en" selected="selected">english</option>
    <option value="ar">العربية</option>
    <option value="az">azərbaycanlı</option>
    <option value="bg">български</option>
    <option value="ca">català</option>
    <option value="cs">český</option>
    <!-- some data cut -->
  </select>
  <select>
    <option value="en">english</option>
    <option value="ar">العربية</option>
    <option value="az" selected="selected">azərbaycanlı</option>
    <option value="bg">български</option>
    <option value="ca">català</option>
    <option value="cs">český</option>
    <!-- some data cut -->
  </select>
  <select>
    <option value="en">english</option>
    <option value="ar">العربية</option>
    <option value="az" selected="selected">azərbaycanlı</option>
    <option value="bg">български</option>
    <option value="ca">català</option>
    <option value="cs">český</option>
    <!-- some data cut -->
  </select>
</div>

您可以选择一个或多个包含值为"az"的<option><select>元素,如下所示:

$("select option[value='az']")