Удалить определенное количество элементов из выпадающего списка

#jquery

#jquery

Вопрос:

У меня проблема в jQuery. У меня выпадающий список состоит, скажем, из 10 элементов. Теперь, щелкнув флажок, я хочу удалить первые пять элементов.

Это также может быть что-то вроде этого: я хочу удалить элементы из индекса 0 в индекс 5. Как это сделать?

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

1. при повторном нажатии флажка их следует вернуть обратно?

2. все вы, люди, слишком быстрые, чтобы я мог вовремя ответить

Ответ №1:

Это должно выполнить то, что вы просите

 $('#checkboxID').click(function(){
  $('#dropdownID > option:lt(5)').remove();
});
  

Демонстрация: http://jsfiddle.net/gaby/VBT42 /


Если вы хотите просто скрыть их, пока установлен флажок, и показать их снова, сняв флажок, затем используйте

 $('#checkboxID').click(function(){
  $('#dropdownID > option:lt(5)').toggle();
});
  

Демонстрация: http://jsfiddle.net/gaby/VBT42/2 / (хотя для IE это не сработает)


И для универсально безопасного удаления / восстановления используйте метод .detach() docs и сохраните ссылку на них с помощью метода .data() docs

 $('#checkboxID').click(function(){
  if (this.checked) {
       $('#dropdownID').data('removedOptions', $('#dropdownID > option:lt(5)').detach() );
  } else {
      var $dropdown = $('#dropdownID');
      $dropdown.prepend( $dropdown.data('removedOptions') );
  }
});
  

Демонстрация: http://jsfiddle.net/gaby/VBT42/4 /

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

1. просто примечание, я думаю, в раскрывающемся списке OP wanted не выбирается поле

2. спасибо .. хотел бы я поместить все u в качестве ans …. могу ли я это сделать? все ответы правильные 🙂

3. @mcgrailm, выпадающие списки реализуются с помощью select тега. Я просто сделал это multiple , чтобы вы могли видеть добавленные / удаленные параметры..

4. Я знаю, как они реализованы, смотрите Мой ответ 8 ^ ) я знаю, что уже поздно, но эй, что ты можешь сделать!

Ответ №2:

Попробуйте что-то подобное в обработчике щелчка флажка / изменения:

  $("#selectBox option:lt(5)").remove();
  

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

1. это селектор на основе нуля, поэтому вам следует использовать lt (5)

Ответ №3:

возможно, это могло бы сработать, сам никогда не пробовал:

 $("option").each(function(index) {
if(index < 5) $(this).remove();
});
  

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

1. да, но задавший вопрос не предоставил строгий выбор параметров.

2. @omnosis … действительно, Габи права .. приведенный выше комментарий верен.. мне просто нужно удалить первые 5 параметров из определенного выпадающего списка. не все …. извините, что не упомянул об этом 🙂

Ответ №4:

добавление в любом случае

 <select name="foo" id="myselect">
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
</select>
<input type="checkbox" id="mycheckbox" />
  

вот jQuery

 $('#mycheckbox').change(function() {
    $("#myselect option:lt(5)").toggle();
    if( $('#myselect option:lt(5)').is(":hidden") ){
        $("#myselect option:eq(5)").attr('selected','selected');
    }else{
        $("#myselect option:eq(0)").attr('selected','selected');
    }
});
  

вот моя скрипка

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

1. Вы должны изменять выделение только тогда, когда вы их скрываете, и только если текущее выделение является одним из скрытых. ( также это не работает в IE )

2. @Gaby aka G. Petrioli если исправил параметры выбора, но не был уверен, как исправить проблему с ie, но, похоже, вы ее решили. Это было хорошее упражнение, спасибо вам и @Joy

Ответ №5:

 $("options selector").each(function(i){if(i<5){$(this).remove();}});