Licznik Dynamicznie tworzone elementy html z jquery

Question

Liczę liczbę wejść na bieżącym dokumencie, które mają wartość. Działa dobrze, z wyjątkiem sytuacji, gdy dynamicznie dodawałem więcej danych wejściowych. Nie mogę dostać tam wartości.

Na przykład może mam

<input id="participant-1"/> 
<input id="participant-2"/> 
... 

Dynamicznie tworzone po kliknięcia przycisku

<input id="participant-15" /> 

Wezmę wartość każdego z nich w pętli for jak

for(var i =1 ; i <25; i++) 
{ 
    ...$('input#participant-' + i).val(); 
} 

teraz Kiedy uruchomię pętlę for, aby sprawdzić wartość każdego z tych wejść, otrzymają one tylko wartości wejść, które nie były 't dynamicznie tworzone. Spojrzałem na inne pytania tutaj i nadal nie mogę zobaczyć, jak zastosować coś w rodzaju .on() do tego, co próbuję osiągnąć.

NOWE KOLEJNE PYTANIE O ODPOWIEDZI OK, teraz myślę, że to jest miejsce, gdzie potrzebuję więcej wyjaśnień dotyczących sposobu użycia .on.

Mam jsfiddle tutaj: JsFiddle example

gdzie tworzę nowe elementy i rozmycia na wszystkich polach tekstowych Chciałbym obliczyć, ile elementów ma wartość i zalogować się. Teraz będzie reagować na zdarzenie blur z elementami, które były statyczne. To nie działa na dynamicznie tworzonych elementów

Answer 1

Daj mu wspólną klasę:

<input class="textbox" id="participant-1"/> 
<input class="textbox" id="participant-2"/> 

I get it like:

var values = []; 
$('.textbox').each(function(){ 
    values.push($(this).val()); 
}); 
console.log(values) 

I odpowiedzieć na EDIT:

składni powinno być: $ (container_selector) .on (event_type, target_selector, callback)

JSFiddle Demo

$('.name').on('blur', 'input', calculate_total); 

Answer 2

można również rozważyć zastosowanie selektora atrybutu CSS.

http://www.w3.org/TR/CSS2/selector.html#attribute-selectors

$("input[id|=participant]").each(function(){ 
      // something 
    }); 

Answer 3

Korzystanie z selektora klasy pozwoli zaoszczędzić czas tutaj.

<input id="participant-1" class="participant"/> 
<input id="participant-2" class="participant"/> 

Następnie za pomocą prostego połączenia liczyć ...

var count = $('.participant').length 
alert ('You have ' + count + ' Counted Inputs'); 
//result is 2 

nadzieję, że ten użyteczny