<body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<div id="main">
<p><button id="add">Добавить строчку</button></p>
<div id="strSchet">
<p id="first">Сумма, р.</p>
<div id="counts">
</div>
</div>
</div>
<script>
$(document).ready(function() {
var i = $('input').size(); //счетчик INPUTS
//обработчик клика по кнопке Добавить строчку
$('#add').click(function(){
if(i<1){
//добавляем INPUT
$('#counts').prepend('<p><span id="ed"><input type="text" id="edit" /><button id="save">Сохранить</button></span></p>');
//ставим фокус на добавленный INPUT
$('#edit').focus();
//ограничение на ввод только цифр
$('#edit').keydown(function (event){
if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27)
{return;}
else {
// убеждаемся, что это цифра, и останавливаем событие keypress
if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 ))
{ event.preventDefault(); }
}
});
i++;//добавляем +1 INPUT
$('#save').click(function() { //обработчик клика по кнопке Сохранить
//сохраняем значение из INPUT в переменную
var val = $('#edit').val();
/*var val_itog = $('#itog').text();//получаем то, что в поле находится*/
//находим строчку, опустошаем, вставляем значение из поля
$('#edit').parent().empty().html(val);
/*$('#itog').text()*/
i--;//Убираем INPUT
});
}
});
$('#counts').on('click','#ed', function(e){
//ловим элемент, по которому кликнули
var t = e.target || e.srcElement;
//получаем название тега
var elm_name = t.tagName.toLowerCase();
//если это инпут - ничего не делаем
if(elm_name == 'input' ){return false;}
//получаем значение из span блока
var val=$(this).html();
//формируем код INPUT
var code = '<input type="text" id="edit" value="'+val+'" /><button id="save">Сохранить</button>';
$(this).empty().append(code);
//устанавливаем фокус на поле
$('#edit').focus();
$('#save').click(function() { //обработчик клика по кнопке Сохранить
var val = $('#edit').val(); //получаем то, что в поле находится
//находим строку, опустошаем, вставляем значение из поля
$('#edit').parent().empty().html(val);
});
});
});
</script>
</body>
Сделал немного по другому уже сам.. спасибо за ответ! приму к сведенью.. думаю как щас ограничить редактирование .. т.е. что в режиме редактирования была только одна строка ??