Kliknij wydarzenie na wybranej opcji elementu w chromie

Question

Mam problem w Chrome z następujących czynności:

var items = $("option", obj); 

items.each(function(){ 

    $(this).click(function(){ 

     // alert("test"); 
     process($(this).html()); 
     return false; 
    }); 
}); 

Impreza click nie wydają się ognia w Chrome, ale działa w Firefox.

Chcę być w stanie click na elemencie option z combo, jeśli zrobię zamiast tego inny rodzaj elementu, powiedzmy, <li> to działa dobrze. Jakieś pomysły? Dzięki.

Answer 1

Nie wierzę, że zdarzenie click jest poprawne w przypadku opcji. Jest on jednak ważny dla wybranych elementów. Spróbuj tego:

$("select#yourSelect").change(function(){ 
    process($(this).children(":selected").html()); 
}); 

Answer 2

Możemy to osiągnąć w inny sposób, pomimo bezpośredniego wywoływania zdarzenia z <select>.

JS części: część

$("#sort").change(function(){ 

    alert('Selected value: ' + $(this).val()); 
}); 

HTML:

<select id="sort"> 
    <option value="1">View All</option> 
    <option value="2">Ready for Review</option> 
    <option value="3">Registration Date</option> 
    <option value="4">Last Modified</option> 
    <option value="5">Ranking</option> 
    <option value="6">Reviewed</option> 
</select> 

Answer 3

Co zwykle pracuje dla mnie jest, aby najpierw zmienić wartość rozwijanego menu, np

$('#selectorForOption').attr('selected','selected')

a następnie wywołać zmianę

$('#selectorForOption').changed()

ten sposób dowolny skrypt, który jest podłączony do

Answer 4

Może jeden z nowych wersji jquery obsługuje zdarzenie kliknij na opcji . Pracował dla mnie:

$(document).on("click","select option",function() { 
    console.log("nice to meet you, console ;-)"); 
}); 

UPDATE: Możliwym USECASE mogłyby być następujące: użytkownik wysyła formularz HTML i wartości są umieszczane w bazie danych. Jednak co najmniej jedna wartość jest ustawiona domyślnie, a znaczniki są oznaczone flagą. Pokazujesz również użytkownikowi, że jego wpis jest generowany automatycznie, ale jeśli potwierdzi wpis, klikając na wybraną opcję, zmienisz flagę w bazie danych. Rzadki przypadek Sue, ale możliwe ...

Answer 5

<select id="myselect"> 
    <option value="0">sometext</option> 
    <option value="2">Ready for Review</option> 
    <option value="3">Registration Date</option> 
</select> 

$('#myselect').change(function() { 
    if($('#myselect option:selected').val() == 0) { 
    ... 
    } 
    else { 
    ... 
    } 
}); 

Answer 6

okazało się, że następujące pracował dla mnie - a nie na wykorzystaniu na kliknięcia, użyj na zmiany np

jQuery('#element select').on('change', (function() { 

     //your code here 

})); 

Answer 7

wiem, że ten fragment kodu działa w celu rozpoznania kliknięcia opcji (przynajmniej w Chrome i FF). Co więcej, działa, jeśli element nie był tam przy obciążeniu DOM. Zwykle używam tego, gdy wprowadzam sekcje wejść do pojedynczego elementu wyboru i nie chcę, aby tytuł sekcji był kliknięty.

$(document).on('click', 'option[value="disableme"]', function(){ 
    $('option[value="disableme"]').prop("selected", false); 
}); 

Answer 8

Miałem podobny problem. Zdarzenie change nie było dla mnie dobre, ponieważ musiałem odświeżyć niektóre dane, gdy użytkownik kliknie na option.Po kilku próbach Mam tego rozwiązania:

$('select').on('click',function(ev){ 
    if(ev.offsetY < 0){ 
     //user click on option 
    }else{ 
     //dropdown is shown 
    } 
}); 

Zgadzam się, że jest to bardzo brzydki i należy trzymać z change imprezy, gdzie można, ale to rozwiązać mój problem.

Answer 9

Od $(this) nie jest poprawna już z ES6 funkcji strzałki, które nie muszą mieć taką samą this niż function() {}, nie należy używać $ (this), jeśli używasz składni ES6.
Poza tym według oficjalnej wersji jQuery anwser, jest prostszy sposób, aby to zrobić, co mówi najlepsza odpowiedź.
Najlepszym sposobem, aby dostać html wybranej opcji jest użycie

$('#yourSelect option:selected').html(); 

html() można zastąpić przez text() lub cokolwiek innego chcesz (ale html() było w pierwotnym pytaniu).
Wystarczy dodać detektor zdarzeń change ze stenograficzną metodą jQuery change(), aby wywołać kod po zmianie wybranej opcji.

$ ('#yourSelect').change(() => { 
    process($('#yourSelect option:selected').html()); 
    }); 

Jeśli chcesz po prostu poznać wartość option:selected (opcji, które użytkownik wybrał) można po prostu użyć $('#yourSelect').val()

Answer 10

Prosty sposób na zmianę select i zaktualizować to jest to.

// BY id 
$('#select_element_selector').val('value').change(); 

kolejny przykład:

//By tag 
$('[name=selectxD]').val('value').change(); 

kolejny przykład:

$("#select_element_selector").val('value').trigger('chosen:updated'); 

Answer 11

Obejście:

$('#select_id').on('change', (function() { $(this).children(':selected').trigger('click'); }));

Answer 12

Patrząc na to w 2018 roku Zdarzenie kliknięcia w tagu opcji, w tagu select, nie jest uruchamiane w przeglądarce Chrome.

Zastosowanie zmiana wydarzenie, i uchwycić wybraną opcję:

$(document).delegate("select", "change", function() { 
    //capture the option 
    var $target = $("option:selected",$(this)); 
}); 

mieć świadomość, że $ docelową może być zbiorem obiektów, jeśli wybierz znacznik jest wielokrotnością.