[jquery] 여러 요소에 대한 jQuery 동일한 클릭 이벤트

페이지의 다른 요소에 대해 동일한 코드를 실행하는 방법이 있습니까?

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

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

대신 다음과 같은 작업을 수행하십시오.

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

감사

답변

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

또는:

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

기존 객체에서도 작동합니다.

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

답변

나는 일반적으로 on대신에 사용 합니다 click. 특정 함수에 더 많은 이벤트 리스너를 추가 할 수 있습니다.

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

그것이 도움이되기를 바랍니다!

답변

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

$ ( ‘. class1, space here.class2’)와 같은 공백을 넣으십시오. 그렇지 않으면 작동하지 않습니다.

답변

$('.myclass1, .myclass2, .myclass3')여러 선택기에 간단히 사용하십시오 . 또한 기존 함수를 클릭 이벤트에 바인딩하기 위해 람다 함수가 필요하지 않습니다.

답변

요소가 변수로 저장되었다고 가정하는 또 다른 대안은 함수 본문에서 여러 번 액세스하는 경우 종종 좋은 아이디어입니다.

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

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

jQuery 체인을 활용하고 참조를 사용할 수 있습니다.

답변

요소를 변수 (jQuery 객체)로 유지하거나 유지하려는 경우 해당 요소를 반복 할 수도 있습니다.

var $class1 = $('.class1');
var $class2 = $('.class2');

$([$class1,$class2]).each(function() {
    $(this).on('click', function(e) {
        some_function();
    });
});

답변

다음과 같이 쉼표로 구분 된 클래스 목록을 추가하십시오.

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

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

//  Your code

    }

});