Блог

Главная - Вопросы по программированию - Как получить количество всех элементов, которые находятся в выпадающем списке, используя jquery

Как получить количество всех элементов, которые находятся в выпадающем списке, используя jquery

#javascript #jquery

#javascript #jquery

Вопрос:

У меня есть выпадающий список, например

  <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>

Теперь я хочу подсчитать все элементы, которые являются «display: inline» при изменении, как я могу это получить.

Комментарии:

1. Примечание: опечатка в строке style-"display:inline"

2. Может помочь вам jsfiddle.net/9SMZD

Ответ №1:

Используйте селектор атрибутов в jquery, чтобы получить длину параметров в выпадающем списке

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

ДЕМОНСТРАЦИЯ

Ответ №2:

По умолчанию display для свойства <option> установлено значение inline

Если вам все еще нужно выполнить фильтрацию в соответствии с этим свойством, используйте это,

 $('#ddlProjects').change(function(){
    var count = $('option',this).filter(function(){
        var css =$(this).attr('style');
        return css !=undefined amp;amp; css.indexOf('display:inline')>-1;
    }).length;
    console.log(count);
});

ДЕМОНСТРАЦИЯ

Ответ №3:

Попробуйте использовать .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);
});

ДЕМОНСТРАЦИЯ

Комментарии:

1. Это не будет работать как значение is по умолчанию display option inline . Он всегда будет возвращать общее количество элементов опции, если только они не скрыты.

2. @RoryMcCrossan, вы правы, сталкиваетесь с той же проблемой.

Ответ №4:

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

Комментарии:

1. Пожалуйста, попробуйте конкретизировать свой ответ немного подробнее. Просто публиковать блок кода без каких-либо объяснений или контекста нехорошо. В его нынешнем состоянии ваш ответ может оказаться бесполезным для людей, ищущих ответ на этот вопрос в будущем.

Метки: