(jquery) podliczanie zawartości input po zwolnieniu klawisza Opcje

[niebieszki]

Witam chciałbym napisać funkcję jquery ktora będzie wyliczac iloczyn 2 pól i wpisywała je do inputa wynik zaraz po wpisaniu 2 wartosci.

Poniżej przedstawiam obrazy i kod źródłowy:
(IMG:http://images38.fotosik.pl/615/053211c552122b7amed.png)

[HTML] pobierz, plaintext 
<table>
	<thead>
		<tr>
			<td>Liczba 1</td>
			<td>Liczba 2</td>
			<td>Wynik</td>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td><input name="liczba1[0]" id="liczba1[0]"></td>
			<td><input name="liczba2[0]" id="liczba2[0]"></td>
			<td><input name="wynik[0]" id="wynik[0]" disabled="disabled"></td>
		</tr>
		<tr>
			<td><input name="liczba1[1]" id="liczba1[1]"></td>
			<td><input name="liczba2[1]" id="liczba2[1]"></td>
			<td><input name="wynik[1]" id="wynik[1]" disabled="disabled"></td>
		</tr>
		.
		.
		.
		<tr>
			<td><input name="liczba1[n]" id="liczba1[n]"></td>
			<td><input name="liczba2[n]" id="liczba2[n]"></td>
			<td><input name="wynik[n]" id="wynik[n]" disabled="disabled"></td>
		</tr>
	</tbody>
[HTML] pobierz, plaintext 

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function() {
	$("input[name='liczba2[0]']").keyup(
			function()
			{
				var wynik = $("input[name='liczba1[0]']").val()*$("input[name='liczba2[0]']").val();
				$("input[name='wynik[0]']").val(wynik);
 
			});
});
[JAVASCRIPT] pobierz, plaintext 

powyższy kod działa dla pierwszego pola (co nie jest rzeczą dziwną)
liczba wierszy tabeli jest nieokreślona, co trzeba zastosować aby ta funkcja była bardziej uniwersalna? próbowałem z pętla for lecz niestety nie wyszło mi.
Czy zna ktoś jakieś rozwiązanie takiego problemu?

[ziolo.92]

Możesz używać notacji tablicowej w taki sposób:

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function() {
	var i=0;
	while(i <= $('table tr').length-2){
		$('#liczba1\\['+i+'\\], #liczba2\\['+i+'\\]')
			.val(0)
			.bind('change', function(){		
				var id = $(this).attr('id');
				id = id.substr(id.indexOf('[')+1, id.length-2-id.indexOf('['));
				var wynik = $('#liczba1\\['+id+'\\]').val()*$('#liczba2\\['+id+'\\]').val();
				$('#wynik\\['+id+'\\]').val(wynik);
 
			});
		i++;
	}
});
[JAVASCRIPT] pobierz, plaintext 

Ale jest to rozwiązanie mało elastyczne. Nadal proponuję Ci skorzystać z poniższego rozwiązania, które mimo że jest wolniejsze to są to takie wartości milisekund, że nie odczujesz różnicy, a dzięki zastosowaniu ":input" odnosi się również do pola select.

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function() {
	$("table :input:not(:disabled)")
		.val(0)
		.bind('change', function(){
					var wynik = 1;
					var tr = $(this).parent().parent();
					tr.find(':input:not(:disabled)')
						.each(function(){
							wynik*=$(this).val();
						});
					tr.find('input:disabled').val(wynik);
		});
});
[JAVASCRIPT] pobierz, plaintext 

Ten post edytował ziolo.92 13.02.2011, 18:23:03