Здравствуйте!
У меня есть форма, поля в которой создаются динамически.
var total = 0;
function add_new_field(){
total++;
$('<tr>')
.attr('id','tr_image_'+total)
.css({lineHeight:'20px'})
.append (
$('<td valign="top" align="center">')
.attr('id','quantity'+total+'')
.attr('class','sum')
.append(
$('<input type="text" />')
.css({width:'60px'})
.attr('id','quantity[]')
.attr('name','quantity[]')
)
)
.append (
$('<td valign="top">')
.attr('id','price'+total+'')
.attr('class','sum')
.append(
$('<input type="text" />')
.css({width:'60px'})
.attr('id','price'+total+'')
.attr('name','price[]')
)
)
.append (
$('<td valign="top">')
.attr('id','summa'+total+'')
.attr('class','sum')
.append(
$('<input type="text" />')
.css({width:'60px'})
.attr('id','summa[]')
.attr('name','summa[]')
)
)
.append (
$('<td valign="top" align="center">')
.css({width:'40px'})
.append (
$('<span id="progress_'+total+'" class="padding5px"><a href="#" onclick="$(\'#tr_image_'+total+'\').remove();" class="ico_delete"><img src="img/delete.png" alt="del" border="0"></a></span>')
)
)
.appendTo('#table_container');
}
$(document).ready(function() {
add_new_field();
});
Я написал код который суммирует значения двух полей и выводит его в третье.
function sum() {
var
price = $('td#price'+total+' input').val(),
quantity = $('td#quantity'+total+' input').val();
$('td#summa'+total+' input').val(price * quantity);
}
$(document).focus().click(function() {
$('td#price'+total+' input, td#quantity'+total+' input').keyup(sum);
$('td#summa'+total+' input').change(sum);
});
Проблема в том, что если добавить новые инпуты, в тех что были добавлены ранее, перестаёт работать функция. Я понимаю, что проблема в переменной total, а вот как мне сделать так, чтобы функция срабатывала во всех инпутах - в новых, и тех что были добавлены ранее ?
