javascript - ejemplos - for jquery

¿Usas.each en objetos dinámicos en jQuery?

Question

Hay muchas preguntas que parecen estar preguntándose esto, pero al final todo lo que quieren es adjuntar eventos .click y no cada uno, por lo que la respuesta generalmente aceptada en todos ellos incluye $("body").on("click", ".selector", function(){}); On $("body").on("click", ".selector", function(){}); y esto definitivamente no es lo que quiero.

Tengo algunas entradas generadas y necesito cambiar el valor de cada una al mismo tiempo. Normalmente, me gustaría $(".inputs").each(function(){$(this).val("new-value")}; o algo parecido, sin embargo, no puedo debido al aspecto dinámico.

Entonces, ¿cómo haría un $("body").on("each", ".inputs", function(){}); ?

Answer 1

Aquí hay una secuencia de comandos mucho mejor que hace exactamente lo que pidió el OP.

function doWithInput(i, e){
 $(e).val("done with each");
}

$(document).ready(function(){
    $("#button").click(function(){
       $("#inputs").append("<input class=''inputs_new'' type=''text'' /><br />");
    });
   $(".inputs").each(doWithInput);
});

$(document).on("DOMNodeInserted", ".inputs_new", function(e) {
 $(e.target).removeClass(''inputs_new'').addClass(''inputs'');
  doWithInput(0, e.target);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="inputs">
    <input class="inputs" type="text" placeholder=''type in me'' /><br />
</div>
<button type="button" id="button">Add</button>

Answer 2

En realidad, es tan simple como ejecutar el .each dentro de setTimout.

setTimeout(function(){
  $(".inputs").each(function(){$(this).val("new-value")});
}, 5000);

Answer 3

Puede usar $(".inputs").each(function(){$(this).val("new-value")}; perfectamente bien en elementos dinámicos. Solo necesita volver a ejecutar el script después de agregar un elemento dinamicamente.

De los comentarios, pensé que existe un malentendido sobre ''cada''. ''Cada'' no es un evento y, por lo tanto, no se activa ningún evento si se llama ''cada''. Si desea realizar un seguimiento de los elementos añadidos porque no tiene control sobre cuándo se agregarán, necesitaría un temporizador:

setInterval(function(){ $(".inputs").each(function(){$(this).val("new-value")}; },500);

Answer 4

$.each funciona con cualquier elemento nuevo agregado.

http://jsfiddle.net/4SV7n/

Hacer algo diferente cada vez:

http://jsfiddle.net/4SV7n/1/