Javascript + Prototype: могу ли я получить список опций, выбранных с событием onChange? - PullRequest
Новая
       9

Javascript + Prototype: могу ли я получить список опций, выбранных с событием onChange?

0 голосов
/ 05 марта 2011

У меня небольшие трудности с некоторыми JS.

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

НО, с onChange - я не могу выбрать последний выбранный вариант, потому что я думаю, что DOM не поддерживает его в этом событии. Вот пример:

HTML: 

<select id="mylist"><option>Test</option>  
<option>Test</option>
<option>Test</option>
<option>Test</option>
</select>

JS: 

Event.observe('mylist', 'change', checkList);

function checkList(e)
{
    var count = 0;
    var listObj = this;
    // Count selected items
    for (i=0; i < listObj.options.length; i++) {
        if (listObj.options[i].selected) {
            count++;
        }
    }

    // If the count is over, tell me the last selected item
    if (count > 10) {
        var e = e || window.event;
        var tgt = e.target || e.srcElement;
        alert(tgt.nodeName + ' Index:' + tgt.index);
    }
}

Если я использую событие onClick, я получаю, например, «OPTION - Index 1». Но используя onChange, я получаю вместо этого узел SELECT.

Есть ли способ, которым я могу надежно получить доступ к нажатой опции?

1 Ответ

0 голосов
/ 05 марта 2011

Что если вы просто поместите логику внутри цикла for? 

function checkList(e)
{
    var count = 0;
    var listObj = this;
    // Count selected items
    for (i=0; i < listObj.options.length; i++) {
        if (listObj.options[i].selected) {
           // If the count is over, tell me the last selected item
           if (++count > 10) {
               alert('Index:' + i);
               return;
           }
        }
    }

}

или даже лучше:

Сохраните логику и используйте селектор, чтобы получитьпоследний выбранный вариант: 

$$('select#mylist option[selected]:last')
...