计算JQuery中Select Dom元素中的options标签数量

Question

如何计算选择DOM元素中的选项数量<option>.

<select data-attr="dropdown" id="input1">
  <option value="Male" id="Male">Male</option>
  <option value="Female" id="Female">Female</option>
</select>

如何在<select>DOM元素中找到options标签的数量,因为我想要打开带有该数量的输入字段的Settings面板,并在其中的下拉框中输入相应的选项值,并在Preview面板中再次更改它.

上面的下拉框位于我的预览面板中,由jQuery生成.

Answer 1

$('#input1 option').length;

这将产生2.

这是工作小提琴

Answer 2

W3C解决方案:

var len = document.getElementById("input1").length;

Answer 3

您可以使用任何长度属性,length然后更好的性能size.

$('#input1 option').length;

或者您可以使用大小函数

$('#input1 option').size(); 

演示

Answer 4

您的问题有点令人困惑,但假设您要在面板中显示选项数量:

<div id="preview"></div>

和

$(function() {
  $("#preview").text($("#input1 option").length + " items");
});

我不确定我理解你的其余问题.

Answer 5

在多选选项框中,您可以使用$('#input1 :selected').length;获取所选选项的数量.如果不满足某些最小数量的选项,这对于禁用按钮很有用.

function refreshButtons () {
    if ($('#input :selected').length == 0)
    {
        $('#submit').attr ('disabled', 'disabled');
    }
    else
    {
        $('#submit').removeAttr ('disabled');
    }
}

Answer 6

好吧,我有一些问题,因为我在里面

$('.my-dropdown').live('click', function(){  
});

我的页面内部有多个,这就是我使用课程的原因.

当我点击它时,我的下拉按照ajax请求自动填充,所以我只有元素$(this)

所以...

我必须做:

$('.my-dropdown').live('click', function(){
  total_tems = $(this).find('option').length;
});

Answer 7

最好的形式就是这个

$('#example option').length