Pytanie Kliknij wydarzenie opcji


jak obsługiwać zdarzenia dla elementów opcjonalnych?

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

Po kliknięciu elementu opcji chcę wyświetlić mały opis elementu. Wszelkie pomysły, jak to zrobić?


16
2018-01-12 15:18


pochodzenie


jaki opis? - amosrivera
Jeśli ktoś przyszedł tutaj po rozwiązanie javascript (nie jQuery), po prostu dodaj detektor zdarzeń dla change zdarzenie. - Sam Eaton
Na przyszłość, pierwsze rozwiązanie podane w odpowiedzi @ niksvp jest właściwie poprawną odpowiedzią na to pytanie. Podana odpowiedź jQuery jest specyficzna dla jQuery, podczas gdy pytanie to nie określa jej użycia. - ManoDestra


Odpowiedzi:


Będziesz chciał użyć jQuery zmień wydarzenie. Wyświetlam tekst opcji jako alert, ale możesz wyświetlać, co chcesz, w zależności od Twoich potrzeb. (Możesz oczywiście umieścić go w innej części strony ... nie musi to być ostrzeżenie.)

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

Pamiętaj też, że dodałem Twój identyfikator select tag, dzięki czemu łatwiej będzie sobie z nim poradzić (nazwałem go myOptions).

Przykład: http://jsfiddle.net/S9WQv/


31
2018-01-12 15:25



to nie działa w IE9 - Bhaskar Melkani
dobrze wiedzieć #myOptions jest select etykietka. - Tomasz Mularczyk


Jak określono przez JasCav za pomocą jQuery możesz to samo zrobić za pomocą 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>

Alternatywnie, zdarzenie onclick opcji, ale pamiętaj, że nie jest kompatybilny we wszystkich przeglądarkach.

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

21
2018-01-12 15:22



Jak to jest dobre rozwiązanie? Możesz wybierać opcje za pomocą klawiatury, nie będą one uruchamiać niczego podobnego. - Steven Lu
@StevenLu - Dobra uwaga, w tym przypadku możesz również wiązać keypress zdarzenie. Ale tutaj OP staje przed trudnością click wydarzenie, które odzwierciedla się w odpowiedzi. - niksvp
Przypuszczam, ale jest to przypadek Problem XY a kliknięcie jest gdzieś w spektrum między marginalnie złym a całkowicie błędnym. Moje przeczucie polega na tym, że zarówno obsługa kliknięć, jak i klawiatury nie pozwalają na działanie tej funkcji na żadnej platformie mobilnej. - Steven Lu