w3schools for ejemplos jquery each

for - jquery each class



jQuery ''.each'' y adjuntando el evento ''.click'' (2)

No es necesario usar .each . click ya se une a todas las ocurrencias div .

$(''div'').click(function(e) { .. });

Ver demostración

Nota: utilice enlaces duros como .click para asegurarse de que los elementos cargados dinámicamente no se unan.

No soy un programador pero me gusta construir prototipos. Toda mi experiencia proviene de ActionScript2.

Aquí está mi pregunta. Para simplificar mi código, me gustaría descubrir cómo adjuntar eventos ''.click'' a div''s que ya existen en el cuerpo HTML.

<body> <div id="dog-selected">dog</div> <div id="cat-selected">cat</div> <div id="mouse-selected">mouse</div> <div class="dog"><img></div> <div class="cat"><img></div> <div class="mouse"><img></div> </body>

Mi (fallida) estrategia fue:
1) hacer una matriz de objetos:

var props = { "dog": "false", "cat": "true", "mouse": "false" };

2) iterar a través de la matriz con ''.each'' y aumentar cada div existente con un evento ''.click''. Por último, construye una variable local.

aquí hay un prototipo:

$.each(props, function(key, value) { $(''#''+key+''-selected'').click(function(){ var key = value; }); });


Una solución que podría usar es asignar una clase más generalizada a cualquier div al que desee vincular el controlador de eventos click.

Por ejemplo:

HTML:

<body> <div id="dog" class="selected" data-selected="false">dog</div> <div id="cat" class="selected" data-selected="true">cat</div> <div id="mouse" class="selected" data-selected="false">mouse</div> <div class="dog"><img/></div> <div class="cat"><img/></div> <div class="mouse"><img/></div> </body>

JS:

$( ".selected" ).each(function(index) { $(this).on("click", function(){ // For the boolean value var boolKey = $(this).data(''selected''); // For the mammal value var mammalKey = $(this).attr(''id''); }); });