Я настроил свой jQuery примерно так.

Он успешно позволяет мне выбрать опцию только один раз за 3 выпадающих списка.

Однако, если я удаляю выпадающий список (используйте удобную кнопку), опция навсегда отключается (отображается серым цветом).

Вы поймете, что я имею в виду. Во-первых, убедитесь, что он работает, и вы не можете выбрать один и тот же параметр более одного раза.

Теперь удалите и обратите внимание, что один из них был отключен, и его уже нельзя выбрать снова.

Я не знаю, почему это навсегда исключает мой выбор? Кажется, он продолжает подниматься при создании массива selectedIndexes.

Кто-нибудь знает, как обойти эту проблему?

1
alex 9 Июл 2010 в 09:45

4 ответа

Лучший ответ

Я внес некоторые изменения в ваш код, их можно увидеть здесь. Это также не работало для меня в начале, но теперь это работает, я думаю, как и ожидалось. Если у вас есть вопросы, просто прокомментируйте :)


Вот так:

Повторно объявите массив $selects после удаления элемента. Ссылка на элемент все еще находится в массиве, поэтому, когда вы позже вычислите выбранные индексы, он все равно будет там!

select.next('button').click(function(event) {
        event.preventDefault();

        select.remove();
       $(this).remove();
       $selects = $('select');  // <-- redeclare selects here, one is gone!
});

В обработчике выбора клика используйте nth-child вместо eq. Первый выберет все option, которые являются i -ым ребенком их родителей. Принимая во внимание, что eq выберет только i -й элемент из набора соответствующих элементов (то есть вернет только один элемент). Обратите внимание, что индекс nth-child является единичным.

// Remove them from this dropdown
$.each(selectedIndexes, function(i, index) {

  // use n-th child here to get the child of each select.
  // eq only selects the element from the matched set
  $thisSelect.find('option:nth-child('+(index+1)+')').attr("disabled","disabled");

});
3
Felix Kling 9 Июл 2010 в 06:10

Даже после удаления массива select element $selects содержал ссылку на него. Я изменил функцию $selects.each:

$selects.each(function() {
        var select = $(this);
        select.next('button').click(function(event) {
        event.preventDefault();

        $selects=$selects.not(select);//ADDED THIS LINE

        select.remove();
        $(this).remove();
    });
});
0
TheVillageIdiot 9 Июл 2010 в 06:24

демо

Это из-за этой строки, var $selects = $('select');.

Да, вы удалили элемент select, но не на этом var $selects.

Это будет исправлено ...

   select.remove();
   $(this).remove();
   $selects = $selects.not(select);

Или

Как это,

   $(this).remove();
   $selects = $selects.not(select.remove());
1
Reigel 9 Июл 2010 в 06:17

Я считаю, что вам нужно добавить код в эту функцию, чтобы удалить связанные значения из массива выбранных значений:

select.next('button').click(function(event) {
        event.preventDefault();

        select.remove();
       $(this).remove();

  });

В качестве альтернативы, вы можете добавить массив для отслеживания значения, которое было выбрано в раскрывающемся списке, удаляемом во время удаления, а затем исключить эти значения из другой функции, где вы выделите серые значения, которые используются.

1
Jeffrey Blake 9 Июл 2010 в 06:03