Question

这是HTML

<select>
  <option value="1">test 1</option>
  <option value="2">test 2</option>
  <option value="3">test 3</option>
  <option value="4" selected="selected">test 4</option>
</select>

我如何知道所选选项的长度/数量？在html中，所选内容为3。

到目前为止，这是what I tried

$("select").on("change", function() {
  var td = $(this);
  $("div").on("click", function() {
    var x = $("select").find("option:selected").length;
    var y = $("select").find("option[value='"+x+"']").length;
    $("span").text(x);
    td.prop('selectedIndex',x);
  });
});

Answer 1

如果您想获得所选的数字，也就是在您的示例中，选项4 =数字3.然后使用以下内容。

$("div").on("click", function() {
  var td = $("select");
  var selected = td.find("option:selected")
  var x = td.find("option").index(selected);
  $("span").text(x);
});

这将使用index()来获得该结果。

＆＃13;

$("div").on("click", function() {
  var td = $("select");
  var selected = td.find("option:selected")
  var x = td.find("option").index(selected);
  $("span").text(x);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
  <option value="1">test 1</option>
  <option value="2">test 2</option>
  <option value="3">test 3</option>
  <option value="4" selected="selected">test 4</option>
</select>
<div>
  wewewewewew
</div>
<span></span>

＆＃13;

Answer 2

您可以使用index()获取所选的选项编号。

您可以使用$(this).val()获取所选值。

您可以使用$(this).find("option:selected").text()来获取所选文字。

＆＃13;

$("select").on("change", function() {
  var valueSelected = $(this).val();
  var selectedText = $(this).find("option:selected").text();
  var getIndex = $(this).find("option:selected").index();
  console.log('Selected Value: ' + valueSelected);
  console.log('Selected text: ' + selectedText);
  console.log('Selected Index: ' + getIndex)
});

$('div').on('click', function() {
  $('select').trigger('change');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
  <option value="1">test 1</option>
  <option value="2">test 2</option>
  <option value="3">test 3</option>
  <option value="4" selected="selected">test 4</option>
</select>
<div>
  Click me
</div>

＆＃13;

如何知道选项中选择的数量

2 个答案: