Jquery可编辑表格
来源:百度文库 编辑:神马文学网 时间:2024/04/24 21:14:49
$(function(){
//隔行换色
$("tbody tr:odd").css("background-color","#eee");
var numId = $("tbody td");
numId.click(function(){
var tdIns = $(this);
if ( tdIns.children("input").length>0 ){ return false; }
var inputIns = $(""); //需要插入的输入框代码
var text = $(this).html();
inputIns.width(tdIns.width()); //设置input与td宽度一致
inputIns.val(tdIns.html()); //将本来单元格td内容copy到插入的文本框input中
tdIns.html(""); //删除原来单元格td内容
inputIns.appendTo(tdIns).focus().select(); //将需要插入的输入框代码插入dom节点中
inputIns.click(function(){ return false;});
//处理Enter和Esc事件
inputIns.keyup(function(event){
var keycode = event.which;
if( keycode == 13 ){ var inputText = $(this).val(); tdIns.html(inputText);}
if( keycode == 27 ){ tdIns.html(text);}
});
});
});