Mam kilka skrzynek tekstowych, które są generowane dynamicznie na podstawie niektórych wyników, które dostaję z innego źródła. Chcę dodać kilka firm wykonawczych do tych tekstów, aby złapać dowolny brelok i upewnić się, że wszystko wprowadzone jest numeryczne.

Generuję te pola tekstowe oparte na długości tablicy w odpowiedzi JSON, tak jak:

for(i=0;i<data.routesout.length;i++)
{           
            content += '<label for="route' + i + '">' + data.routesout[i].name + '(%)</label>';
            content += '<input type="text" name="route' + i + '" id="route' + i + '" value="' + data.routesout[i].percent>';            
}

Jak mogę przymocować pojedynczą obsługę zdarzeń do wszystkich tych potencjalnych wejść?

0
sxthomson 27 październik 2011, 18:42

3 odpowiedzi

Najlepsza odpowiedź

Oznaczasz pytanie z jQuery, więc zastanawiam się, dlaczego nie używasz biblioteki, aby zbudować treść:

var content = [];
for (var i = 0; i < data.routesout.length; ++i) {
  content.push($('<label/>', { 'for': 'route' + i, text: data.routesout[i].name }));
  content.push($('<input/>', { change: yourEventHandler, type: 'text', name: 'route' + i, id: 'route' + i, value: date.routesout[i].percent, change: yourEventHandler }));
}

Robiąc to w ten sposób, możesz wiązać element obsługi elementu, gdy je skonstruujesz. (Kiedyś użyłem "zmiany" jako przykład, ale można wiązać obsługę obsługi dla każdego wydarzenia w ten sam sposób.)

Na koniec można dołączyć wszystkie stworzone elementy, jednak chcesz, albo mógłbyś je dołączyć, zamiast budować tablicę.

3
Pointy 27 październik 2011, 14:49

Możesz użyć start z selektor

$('input[id^="route"]').keyup(function(){...

Należy pamiętać, że jeśli tworzysz je w locie, może być konieczne dołączenie zdarzenia za pomocą na żywo :

$('input[id^="route"]').live('keyup', function(){...
3
Adam Hopkinson 27 październik 2011, 14:45

A co z tym?

for(i=0;i<data.routesout.length;i++){           
  content += '<label for="route' + i + '">' + data.routesout[i].name + '(%)</label>';
  content += '<input onkeypress="doSomething(this)" type="text" name="route' + i + '" id="route' + i + '" value="' + data.routesout[i].percent + '>';            
}

function doSomething(element){
  /* this function will be called when user presess key inside a textbox */
}
1
Marian Bazalik 27 październik 2011, 14:51