2013-11-08 3 views
1

я попытался следующий код для создания выпадающего меню в HTMLHtml падение вниз: как обрабатывать ключевые события выбора опции элемента

<select onkeydown="func()"> 
<option>a</option> 
<option>b</option> 
<option>c</option> 
<option>d</option> 
</select> 

при нажатии на кнопку выпадающего списка меню открывает: опции : a b c d что im tring нажимает клавишу backspace, выпадающее меню должно закрываться, а фокус должен быть установлен в раскрывающееся меню, но im не удается запустить событие, когда фокус находится в элементе списка drop вниз. Я был бы признателен за помощь. спасибо.

+0

Проверьте решение !, и изменить его в соответствии с вашими требованиями, если и нужно ... :) –

ответ

1

Я разместил полный пример, он решает следующие вещи

  • Когда Кропите открыт и пользователь нажмет BACKSPACE, то сбросить значение (которое может б любой).
  • Дает фокус обратно выпадающий
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Backspacing in a dropdown</title> 
    <script type="text/javascript" 
     src="http://code.jquery.com/jquery-latest.js"></script> 
</head> 
<body> 
    <form> 
     <p> 
      When Drop Down is open and user has clicked Backspace, it goes back to selected value <br /> 
     </p> 
    <select id="mySelectDropDown"> 
     <option>Boston</option> 
     <option selected="true">Texas</option> 
     <option>London</option> 
     <option>Bolton</option> 
    </select> 
    </form> 

    <script type="text/javascript"> 
     $(document).ready(function() { // FF needs keypress, IE needs keydown 
      $('select').keypress(function(event) 
       { return cancelBackspace(event) }); 
      $('select').keydown(function(event) 
       { return cancelBackspace(event) }); 
     }); // ready 

     function cancelBackspace(event) { 
      if (event.keyCode == 8) { 
       var element = document.getElementById('mySelectDropDown'); 
       element.value = 'London'; 
       $('#mySelectDropDown').toggle(); 
       $('#mySelectDropDown').focus; 
       return false; 
      } 
     } 
    </script> 

</body> 
</html> 
+1

@mateen вы можете использовать элемент. selectedIndex = 0; вместо element.value, а также установить индекс для выбранного вами элемента –

+0

Привет, thnx для ответа, я проверил ваш код, но все же он не решает мою цель, в приведенном выше коде backspace работает только тогда, когда выпадающий объект закрыт , но я хочу, чтобы backspace работал, когда выпадающий список указан или открыт. – mateen

+0

его рабочий чувак, с раскрывающимся вскрытием и без него ... jquery работает на вашем конце? –

Смежные вопросы