Нажмите на опцию события

Question

как мне обрабатывать события для элементов опции?

<select>
      <option value='option1'>Gateway 1</option>
      <option value='option2'>Gateway 2</option>
      <option value='option3'>Gateway 3</option>
 </select>

Когда щелкает элемент опции, я хочу отобразить небольшое описание для элемента.Есть идеи как это сделать?

Answer 1

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

$('#myOptions').change(function() {
    var val = $("#myOptions option:selected").text();
    alert(val);
});

Также обратите внимание, что я добавил идентификатор в ваш тег select, чтобы вам было проще обрабатывать события (я назвал его myOptions).

Пример: http://jsfiddle.net/S9WQv/

Answer 2

Как указано JasCav с помощью jQuery, вы можете сделать то же самое в javascript, используя

 <select onchange="alert(this.options[this.selectedIndex].text);">
      <option value='option1'>Gateway 1</option>
      <option value='option2'>Gateway 2</option>
      <option value='option3'>Gateway 3</option>
 </select>

В качестве альтернативы, опция onclick, но обратите внимание, что она не совместима во всех браузерах.

<select>
      <option value='option1' onclick="alert(this.value);" >Gateway 1</option>
      <option value='option2'>Gateway 2</option>
      <option value='option3'>Gateway 3</option>
</select>