Taichi,
вставить количество и цену
<html>
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<style>
table tbody:first-child td:last-child input {
display: none; /* кнопка удаления в первой строке таблицы недоступна*/
}
.total {
margin-left: 400px;
}
</style>
<script type="text/javascript">
$(function() {
var tbl = $('table');
$('#add').click(function() {
tbl.children() //получаем детишек - TR/TBODY
.first() //берем первого
.clone() //клонируем
.appendTo(tbl) //добавляем в таблицу
.find('input') //получаем поля ввода
.filter(':text').val('') //выбираем текстовые поля (если кнопка удаления не input, то этого не надо)
.end() //в начало набора
.last().click(function() { //получаем кнопку удаления (если кнопка удаления не input, то ищем нужно вместо last())
$(this).closest('tr').remove() //удаляем добавленную строку
sum();
})
});
function sum()
{
var a = document.querySelectorAll('input[name="a[]"]'),
b = document.querySelectorAll('input[name="b[]"]'),
c = document.querySelectorAll('input[name="c[]"]'),
t = document.querySelector('.total');
t.innerHTML = [].reduce.call( a , function(s, el, i) {
c[i].value = (+el.value||0) * (+b[i].value||0);
return s + +c[i].value
},0).toFixed(2) + " руб.";
}
$('form').on('input', 'input[name="a[]"], input[name="b[]"]', sum)
});
</script>
</head>
<body>
<form action="" method="post">
<table>
<tr>
<td>
<input name="a[]" />
</td>
<td>
<input name="b[]" />
</td>
<td>
<input name="c[]" disabled="disabled"/>
</td>
<td>
<input type="button" value="Del" />
</td>
</tr>
</table>
<span class="total"></span>
</form>
<button id="add">Add</button>
</body>
</html>