jQuery to samo zdarzenie click dla wielu elementów

Question

Czy istnieje sposób na wykonanie tego samego kodu dla różnych elementów na stronie?

$('.class1').click(function() { 
    some_function(); 
}); 

$('.class2').click(function() { 
    some_function(); 
}); 

zamiast zrobić coś takiego:

$('.class1').$('.class2').click(function() { 
    some_function(); 
}); 

Dzięki

Answer 1

$('.class1, .class2').on('click', some_function); 

czyli

$('.class1').add('.class2').on('click', some_function); 

Answer 2

prostu użyć $('.myclass1, .myclass2, .myclass3') dla wielu selektorów. Ponadto nie potrzebujesz funkcji lambda, aby powiązać istniejącą funkcję ze zdarzeniem kliknięcia.

Answer 3

$('.class1, .class2').click(some_function); 

Upewnij się umieścić spację jak $ (”. Class1, przestrzeń here.class2') else to przyzwyczajenie praca

Answer 4

normalnie używam on zamiast click. To pozwala mi dodawać więcej zdarzeń słuchaczy do określonej funkcji.

$(document).on("click touchend", ".class1, .class2, .class3", function() { 
    //do stuff 
}); 

Mam nadzieję, że pomoże!

Answer 5

Inną alternatywą, zakładając, że elementy są przechowywane jako zmienne (która często jest dobrym pomysłem, jeśli masz dostęp do nich kilka razy w ciele funkcji):

function disableMinHeight() { 
    var $html = $("html"); 
    var $body = $("body"); 
    var $slideout = $("#slideout"); 

    $html.add($body).add($slideout).css("min-height", 0); 
}; 

wykorzystuje jQuery łańcuchowych i pozwala używać referencji.

Answer 6

Mam łącze do obiektu zawierającego wiele pól wejściowych, które musi być obsługiwane przez to samo zdarzenie. Więc po prostu użyć find() aby wszystkie wewnątrz obiektów, które muszą mieć zdarzenie

var form = $('<form></form>'); 
// ... apending several input fields 

form.find('input').on('change', onInputChange); 

W przypadku, gdy obiekty są o jeden poziom w dół link dzieci() zamiast find() Metoda może być użyta.

Answer 7

Możemy kodować podobnie jak poniżej, użyłem tutaj zdarzenie blur.

$("#proprice, #proqty").blur(function(){ 
     var price=$("#proprice").val(); 
     var qty=$("#proqty").val(); 
     if(price != '' || qty != '') 
     { 
      $("#totalprice").val(qty*price); 
     } 
    }); 

Answer 8

Oprócz doskonałych przykładów i odpowiedzi powyżej, można również wykonać "szukanie" dla dwóch różnych elementów za pomocą ich klas. Na przykład:

<div class="parent"> 
<div class="child1">Hello</div> 
<div class="child2">World</div> 
</div> 

<script> 
var x = jQuery('.parent').find('.child1, .child2').text(); 
console.log(x); 
</script> 

Powinno to wypisać "HelloWorld".

Answer 9

Dodaj oddzielonych przecinkami listę klas tak:

jQuery(document).ready(function($) { 

$('.class, .id').click(function() { 

// Your code 

    } 

});