昨天在家里看了一点php100的视频教程，看了一个即点即改的实现，我觉得挺不错的写的，所以今天中午就写了一下看能不能写出来，嘿嘿，凭自己的理解还真写出来了，这个是用jquery实现的。感觉还是挺好的，可以节省大量的php代码。并且对于用户的体验也是有很大好处的。
下面就给大家看一下代码，这里我有没有链接数据库读取数据，只是写了一个静态的数据来实现。我们在用的时候可以稍作修改或者扩展。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<body> <table id="table" border="1" cellpadding="0" cellspacing="0" width="400" height="100"> <tr id="1"><td fd="name">小张</td><td fd="age">19岁</td></tr> <tr id="2"><td fd="name">小李</td><td fd="age">20岁</td></tr> <tr id="3"><td fd="name">小王</td><td fd="age">21岁</td></tr> <tr id="4"><td fd="name">小赵</td><td fd="age">22岁</td></tr> </table> <script type="text/javascript" src="public/xheditor/jquery-1.4.4.min.js"></script> <script> $(document).ready(function(){ $("td").dblclick(function(){ var inval = $(this).html(); //获取选中的值 var inid = $(this).parents().attr("id"); //获取记录的id var infd = $(this).attr("fd"); //获取选中的字段名 $(this).html("<input type='text' id='dian"+inid+infd+"' value='"+inval+"'>");//写入input $("#dian"+inid+infd).focus().live("blur",function(){ var zhi = $(this).val();//获取失去焦点的表单的值 $(this).parents("td").html(zhi); $.post('1.php',{id:inid,fd:infd,val:zhi});//ajax }); }); }); </script> </body> |
这个方法还是比较好的，这里需要注意几点，tr的id是记录的唯一标识主键id,fd是字段名,这样双击的时候获取id，字段，值，当焦点一移开就执行ajax。其实是很简单的，也可以稍改一下，可以获得表名，这样，只要我们的数据列表都这样规则来写，就可以通用一个编辑php方法了，有表名，id，字段名，值，这样就可以执行修改了。里面有几个jquery的不是很常用的函数，大家可以查一下用法。欢迎大家指正！
本文链接：http://www.521php.com/archives/530/
程序本天成，妙手偶得之！我们只是代码的搬运工！
转载请注明：http://www.521php.com/archives/530/
