上一个功能有点少，这个V1.0版本是最小集合的。

=================================

双击单元格编辑，可以添加，删除单元格。并且保持相邻单元格不同的背景色。

引用了“My97DatePicker”日历插件。

开始使用

.edtitable tbody tr:nth-child(odd) td,

.edtitable tbody tr:nth-child(odd) th {

background-color: #EEF4F5;

}

.edtitable tbody tr:last-child td{

background-color: #ECE9D8!important;

}

这段css3来实现相邻变色，无奈不支持ie8,故放弃。最后使用jq点击使得相邻不同的背景色。

=================核心JS代码======================

//需要首先通过Jq来解决内容部分奇偶行的背景色不同

$(document).ready(function(){

//找到表格的内容区域中所有的奇数行

//使用even是为了把通过tbody tr返回的所有tr元素中，

//在数组里面下标是偶数的元素返回，因为这些元素，

//实际上才是我们期望的tbody里面的奇数行

$("tbody tr:even").css("background-color","#EEF4F5");

trEdit();//td的点击事件封装成一个函数

});

/*下面兩段开始添加删除行**/

$(document).ready(function() {

$("#addBtn").bind("click", function(){

$("<tr><td></td><td></td><td class='Wdate-col'><input class='Wdate' type='text' onClick='WdatePicker()'/></td><td class='del-col'><a href='javascript:void(0);' class='delBtn'>删除</a></td></tr>").insertBefore(".append-row");

trEdit();

delTr();

$("tbody tr:even").css("background-color","#EEF4F5");

});

delTr();

});

//删除

function delTr(){

$(".delBtn").click(function(){

$(this).parent().parent().remove();

$("tbody tr").css("background-color","#FFF");//先清空，在赋值

$("tbody tr:even").css("background-color","#EEF4F5");

});

}

/*

function even(){

$("tbody tr:even").css("background-color","#ECE9D8");

}*/

//我们需要找到所有的单元格

function trEdit(){

var numTd = $("tbody td").not(".del-col,.Wdate-col");

//给这些单元格注册鼠标点击的事件

numTd.dblclick(function() {

//找到当前鼠标点击的td,this对应的就是响应了click的那个td

var tdObj = $(this);

if (tdObj.children("input").length > 0) {

//当前td中input，不执行click处理

return false;

}

var text = tdObj.html();

//清空td中的内容

tdObj.html("");

//创建一个文本框

//去掉文本框的边框

//设置文本框中的文字字体大小是12px

//使文本框的宽度和td的宽度相同

//设置文本框的背景色

//需要将当前td中的内容放到文本框中

//将文本框插入到td中

var inputObj = $("<input type='text'>").css({"border-width":"0","height":"28px","font-size":"12px","text-align":"center"})

.width(tdObj.width())

.css("background-color",tdObj.css("background-color"))

.val(text).appendTo(tdObj);

//是文本框插入之后就被选中

inputObj.trigger("focus").trigger("select").css("background-color","#CDCC34");

//下面这段是失去焦点

inputObj.blur(function(){

var value=inputObj.val();

inputObj.parent().html(value);//找到input的父元素td,获取当前数值

});

inputObj.click(function() {

return false;

});

//处理文本框上回车和esc按键的操作

inputObj.keyup(function(event){

//获取当前按下键盘的键值

var keycode = event.which;

//处理回车的情况

if (keycode == 13) {

//获取当当前文本框中的内容

var inputtext = $(this).val();

//将td的内容修改成文本框中的内容

tdObj.html(inputtext);

}

//处理esc的情况

if (keycode == 27) {

//将td中的内容还原成text

tdObj.html(text);

}

});

});

}

 =======================================

链接地址：http://files.cnblogs.com/files/leshao/EditTable-V1.0.rar

css3实现的链接：http://files.cnblogs.com/files/leshao/EditTable-css3.rar（不支持ie8）

======================

特此感谢雨安合一大侠，天意，员外，午夜等朋友。