求一个JQ可直接编辑的表格插件!急急急! 本人急需一个可直接编辑的表格插件,就是点在某一个数据项上,它会自动变成可编辑的类似文本框这样的状态。我找了好久找不到谁能推荐一下? 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><title>jquery表格编辑</title> <script type="text/javascript" src="jslib/jquery.js"></script> <script type="text/javascript" src="jslib/jqueryedit.js"></script></head><body><table border="1"> <tr> <td>12345</td> <td>2466</td> </tr></table></body>jqueryedit.js文档内容$(document).ready(function(){ var tds = $("td"); tds.click(tdclick);})function tdclick(){ //0.获取当前的TD元素 var td=$(this); //1.保存TD元素中的内容 var tdValue=td.text(); //2.清空td中的内容,也可以用html("") td.empty(); //3.建立input元素 var input = $("<input>"); //4.将td中的内容,放入到input中 //input.attr("type","text"); input.attr("value",tdValue); input.keyup(function(even){ // 0. 获取当前用户按下的键值 // 解决不同浏览器获取事件对象的差异 var myEvent=even || window.event; var keycode=myEvent.keyCode; if(13 == keycode){ //获取当前的input元素 var inputNode=$(this); //取得input中的value值 var inValue=inputNode.val(); //清空td中的内容 var tdNode=inputNode.parent(); tdNode.html(""); //将input中的value值放入到td中. tdNode.html(inValue); //将td重新注册click事件 tdNode.click(tdclick); }else if(27 == keycode){ //27是对于键盘的ESC键 //$(this)是获得当前的input jquery对象 var inputNode=$(this); //parent()获得当前对象的父对象 var tdNode=inputNode.parent(); //清空td中的内容 tdNode.empty(); //因为前面保存过td中的值,所以用.html(tdValue) tdNode.html(tdValue); //重新注册click事件. tdNode.click(tdclick); } }); //5.将文本框加入到,用append(input),将input加入 //或者也可以用input.appendTo(td);就是将input加入到td中去 td.append(input); //通过jquery对象的get方法,取得dom对象,参数中的0表示第一个对象. //相当于对象的下标 var inputDom=input.get(0); inputDom.select(); //解除click事件 td.unbind("click"); } FTL文件在浏览器中显示中文出现乱码 JS有BUG,麻烦各位帮我看下 京东上边的横向的导航条怎么写的? 学javacript的一个经典网站,对菜鸟有帮助 setTimeout()问题 如何判断表单内容无变化 我想学好jsp请问怎么能系统学jsp呢? JS的弹出窗口返回值问题 JavaScript的BUG吗?请专家释疑! 最高难度:如何自动生成上载的jpg的gif缩略图?分数我还有。 仿msn提示信息,层闪动问题 【疑难杂症】用 ie7 浏览抛该内存不能为 read 的错误,可是火狐不会
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>jquery表格编辑</title>
<script type="text/javascript" src="jslib/jquery.js"></script>
<script type="text/javascript" src="jslib/jqueryedit.js"></script>
</head>
<body>
<table border="1">
<tr>
<td>12345</td>
<td>2466</td>
</tr>
</table></body>jqueryedit.js文档内容
$(document).ready(function(){
var tds = $("td");
tds.click(tdclick);
})function tdclick(){ //0.获取当前的TD元素
var td=$(this);
//1.保存TD元素中的内容
var tdValue=td.text();
//2.清空td中的内容,也可以用html("")
td.empty();
//3.建立input元素
var input = $("<input>");
//4.将td中的内容,放入到input中
//input.attr("type","text");
input.attr("value",tdValue); input.keyup(function(even){
// 0. 获取当前用户按下的键值
// 解决不同浏览器获取事件对象的差异
var myEvent=even || window.event;
var keycode=myEvent.keyCode;
if(13 == keycode){
//获取当前的input元素
var inputNode=$(this);
//取得input中的value值
var inValue=inputNode.val();
//清空td中的内容
var tdNode=inputNode.parent();
tdNode.html("");
//将input中的value值放入到td中.
tdNode.html(inValue);
//将td重新注册click事件
tdNode.click(tdclick);
}else if(27 == keycode){
//27是对于键盘的ESC键
//$(this)是获得当前的input jquery对象
var inputNode=$(this);
//parent()获得当前对象的父对象
var tdNode=inputNode.parent();
//清空td中的内容
tdNode.empty();
//因为前面保存过td中的值,所以用.html(tdValue)
tdNode.html(tdValue);
//重新注册click事件.
tdNode.click(tdclick);
}
});
//5.将文本框加入到,用append(input),将input加入
//或者也可以用input.appendTo(td);就是将input加入到td中去 td.append(input);
//通过jquery对象的get方法,取得dom对象,参数中的0表示第一个对象.
//相当于对象的下标
var inputDom=input.get(0);
inputDom.select();
//解除click事件
td.unbind("click");
}