实现可编辑单元格(使用Ajax完成后台交互)。

function editableTable(className){
var name = $("."+className);
name.click(function () {
//找到当前鼠标单击的td
var tdObj = $(this);
//保存原来的文本
var oldText = $(this).text();
//创建一个文本框
var inputObj = $("<input type='text' value='" + oldText + "'/>");
//去掉文本框的边框
inputObj.css("border-width", 0);
inputObj.click(function () {
return false;
});
//使文本框的宽度和td的宽度相同
inputObj.width(tdObj.width());
inputObj.height(tdObj.height());
//去掉文本框的外边距
/* inputObj.css("margin", 0);
inputObj.css("padding", 0);
inputObj.css("text-align", "center");   */
inputObj.css("font-size", "12px");
inputObj.css("background-color", tdObj.css("background-color"));
//把文本框放到td中
tdObj.html(inputObj);
//文本框失去焦点的时候 ajax请求后台，完成数据交互，并将input框变更为文本
inputObj.blur(function () {
var date=tdObj.attr("month")+""+tdObj.attr("date");
var index=Number(tdObj.attr("date"));
var employeeCode=tdObj.attr("employeeCode");
var dateType=tdObj.attr("dateType");
var newText = $(this).val();
var numPo=/^\d+(\.\d+)?$/;
var space = /^\s*$/;
if(! space.test(newText)){
if(!numPo.test(newText)){
$("#update1Alert span").text("工作时长输入不合法");
$("#update1Alert").removeClass("hidden");
return false;
}
}else{
newText="0.00";
}
var url="";
var params="employeeCode="+employeeCode+"&dateId="+date+"&newHour="+newText;
if(dateType=='infactdayHour'){
url="${requestContext.contextPath}/rest/manhaur/updateInfactHour";
}else{
url="${requestContext.contextPath}/rest/manhaur/updateInInfactExtra";
}
$.ajax({
type: "POST",
async : false,
data : params,
url: url,
dataType: "json",
success: function(respData){
var data = respData.data;
/* alert(data.status); */
if(data.status){
/* alert(111); */
tdObj.html(data.newHourD);
inputObj.css("font-size", "12px");
//tdObj.html(data.newGap);
$("#gapDayHour"+index+"t"+employeeCode).html(data.newGap);
}else{
/* alert(2221); */
alert(data.message);
tdObj.html(oldText);
}
}
});
});
//全选
inputObj.trigger("focus").trigger("select");
});
}