如何使用jquery计算下拉列表中的所有元素的数量

Question

我有下拉列表，如

 <select id="ddlProjects">
   <option value="315">resproject</option>
   <option value="320" style-"display:inline">newheavn</option>
   <option value="395" style="display:inline">cealon sales</option>
   <option value="395" style="display:inline">cealon sales</option>
 </select>

现在，我想要计算所有＆＃34;显示：inline＆＃34;在改变时，我怎么能得到它。

Answer 1

默认情况下，display的{​​{1}}属性设置为<option>

如果仍需要根据此属性进行过滤，请使用此

inline

<强> Demo

Answer 2

尝试在此上下文中使用.filter()，

$('#ddlProjects').change(function(){
  var count = $(this).children().filter(function(){
    return $(this).css('display') === "inline" 
  }).length;
  console.log(count);
})

在这种情况下尝试使用attribute contains selector，因为option元素的默认显示属性是内联的。

$('#ddlProjects').change(function(){
    var count = $('option[style*="display:inline"]',this).length;
    console.log(count);
});

DEMO

Answer 3

$('#ddlProjects option').filter(function() {
    return $(this).css('display') === 'inline';
}).length;

Answer 4

在jquery中使用属性选择器来获取下拉列表中选项的长度

    $('#ddlProjects').change(function(){
    var len = $(this).find('option[style="display:inline"]').length
    console.log(len)
   });

DEMO