Событие onchange для Combobox (изменение стрелкми клавиатуры)
Здравствуйте!
Прошу помощи со скриптом. На страничке есть комбобокс со списком из 5 элементов. Если выбран элемент №5, должно появиться окошечко input. html: <select name="elemId" id="elemId"> <option value=""></option> <option value="1" id="elemId_1">пункт 1</option> <option value="2" id="elemId_2">пункт 2</option> <option value="3" id="elemId_3">пункт 3</option> <option value="4" id="elemId_4">пункт 4</option> <option value="5" id="elemId_5">пункт 5 (вписать)</option> </select> <div id ="txt"> <input type="text" name="txt" size="20" id="txt_input"> </div> Я повесила скрипт на изменение этого комбобокса: function checkCombo(){ var el=document.getElementById("elemId"); var divTxt=document.getElementById("txt"); var inpTxt=document.getElementById("txt_input"); el.onchange=function (){ if(el.value!=5){ divTxt.style.display="none"; }else{ divTxt.style.display="block"; inpTxt.value=""; } } } Выбирать значение из списка можно либо мышкой, либо клавишами (стрелочками). Проблема заключается в том, что в браузере FireFox onchange не срабатывает, если изменять значения в списке клавишами (при клике мышкой все работает). В хроме, опере и IE все отрабатывает нормально. Пока что, чтобы работало везде, повесила функцию проверки и на onchange, и на onkeyup. Подскажите, пожалуйста, можно ли решить эту проблему более грамотно? |
Manyasha,
Firefox ждёт onblur. Можно так сделать <select name="elemId" id="elemId"> <option value=""></option> <option value="1" id="elemId_1">пункт 1</option> <option value="2" id="elemId_2">пункт 2</option> <option value="3" id="elemId_3">пункт 3</option> <option value="4" id="elemId_4">пункт 4</option> <option value="5" id="elemId_5">пункт 5 (вписать)</option> </select> <div id="txt"> <input type="text" name="txt" size="20" id="txt_input"> </div> <script> document.addEventListener('DOMContentLoaded', function () { var el = document.getElementById("elemId"); var divTxt = document.getElementById("txt"); var inpTxt = document.getElementById("txt_input"); el.onchange = function () { if (el.value != 5) { divTxt.style.display = "none"; } else { divTxt.style.display = "block"; inpTxt.value = ""; } } el.onkeyup = function (e) { e.target.blur(); e.target.focus(); } }); </script> |
destus,
Такой особенности я не знала. Спасибо Вам большое за урок! Все прекрасно работает! |
Часовой пояс GMT +3, время: 14:51. |