IE javascript: при выборе опции удаляется узел опции из нескольких вариантов выбора - PullRequest
Новая
       0

IE javascript: при выборе опции удаляется узел опции из нескольких вариантов выбора

2 голосов
/ 14 октября 2011

У меня есть код, который удаляет элемент опции из тега выбора нескольких (<select multiple></select>) при щелчке по опции.Код работает + - вот так. 

var option = new Option("sometext","someval");
$(option).click( function(){
                selectBox.remove(option);
                return false;
            }
        );
$(selectBox).append(option);

Он очень хорошо работает на всех движках, которые я помню (gecko, presto, webkit ...), кроме IE.

Согласно моим исследованиямIE не поддерживает добавление событий в теги параметров, поэтому я добавил событие в тег выбора. 

$(selectBox).click( function(event){
                if (option === selectBox.options[selectBox.selectedIndex]) {
                    event.preventDefault();
                    event.stopPropagation();
                    selectBox.remove(option);
                    return false;
                }
                event.preventDefault();
                return true;
            }
        );

Где находится: if (option === selectBox.options[selectBox.selectedIndex]) {
Я уже пробовал: if ($(option).is(':selected')) {
Didn 'либо не работает.

Что происходит: когда я щелкаю опцию, все связанные функции активируются, и после удаления элемента могут быть активированы функции.
Использование event.stopPropagation(); (в любом случае распространение продолжается)не делать то, что я хочу, как все другие события также называются.Изменение события с щелчка на изменение не решает проблему, поскольку при изменении выбранного параметра он удаляется, а затем выбранный параметр становится другим, в результате чего событие вызывается снова, и, в конце концов, все элементы в выборе удаляются..

1 Ответ

1 голос
/ 14 октября 2011

Попробуйте этот код; Предположим, selectBox является элементом DOM, объектом JQuery или селектором CSS, который указывает на элемент <select>: 

$(selectBox).click(function(){
    var selectedOption = this.selectedIndex;
    $("option", selectBox).each(function(index){
        if(index == selectedOption){
            $(this).remove();
            return false; //Stop looping
        }
    });
})

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

Вместо использования .click, я рекомендую использовать .change, так что изменения выбора с помощью клавиатуры (клавиши со стрелками + вкладка) также рассматриваются.

...