Добавить обработчик событий для каждого из них с помощью jquery

Question

Как я могу использовать .on и .each вместе?

$('[id^="thing"]').each(???) 

Один из них будет:

$("#button").on("click", function() { 
        console.log(this.id) 
}) 

Answer 1

Вызов .on() на объект JQuery, содержащий несколько элементов будет добавить обработчик к каждому элементу.

Answer 2

$('[id^="thing"]').on("click", function() { }); 

Answer 3

попробовать

$('[id^="thing"]').each(function(i, el) { 
     $(el).on("click", function() {     
     }) 
    }); 

Answer 4

вы не нужно .each с .on,

вещь, которую вы хотите, может быть сделано только с этим -

Хороший способ

$(document).on('click','[id^="thing"]', function() { 
    console.log(this.id) 
}); 

это может быть сделано, как вы хотите, но как это повлияет на производительность без причины

так, как вы хотите, но следует избегать

$('[id^="thing"]').each(function(){ 
    $(this).on('click', function() { 
    console.log(this.id) 
    }); 
}); 

, и если вы будете использовать .on внутри .each вы можете
в конечном итоге в связывание события несколько раз таким образом

неправильный путь

$('[id^="thing"]').each(function(){ 
    $('[id^="thing"]').on('click', function() { 
    console.log(this.id) 
    }); 
}); 

Answer 5

Вы можете использовать эту версию, чтобы указать селектор, чтобы определить, какие дочерние элементы должны инициировать событие.

$('[id^="thing"]').on('click','button (or whatever selector)', function(){ 
    // "this" refers to triggering element 
    alert($(this).text()); 
});