PHP Code
- <table>
- <Tr><Td colspan="2">如果本例看不到数据请先添加一条记录,点击<a href="?action=add">这里可以添加</a></Td></Tr>
- <?php
- $sql="select * from `add_delete_record` where id>0";
- $rs=mysql_query($sql);
- if ($row = mysql_fetch_array($rs))
- {
- do {
- ?>
- <Tr bgcolor="#eeeeee">
- <Td><?php echo $row['id']?></Td>
- <Td class="bigclassname" ><span title="点击修改"><?php echo $row['text']?></span></Td>
- </Tr>
- <?php
- }
- while ($row = mysql_fetch_array($rs));
- }?>
- </table>
JavaScript Code
- <script>
- /**//*
- * 说明:用Jquery的方法,无刷新页面,编辑表格
- */
- $(function() {
- //给页面中有bigclassname类的标签上加上click函数
- $(".bigclassname").click(function() {
- var objTD = $(this);
- //先将老的类别名称保存起来,并用trim方法去掉左右多余的空格
- var oldText = $.trim(objTD.text());
- //构造一个input的标签对象(作用是为了让这个input失效,不然点击多次后,文字会消失)
- var input = $("<input type='text' value='" + oldText + "' />");
- //当前td的内容变为文本框,并且把老类别名放进去
- objTD.html(input);
- //设置文本框的点击事件失效
- input.click(function() {
- return false;
- });
- //设置文本框样式,让界面显示的人性化点
- input.css("font-size", "16px");
- input.css("text-align", "center");
- input.css("background-color", "#ffffff");
- input.width("120px");
- //自动选中文本框中的文字
- input.select();
- //文本框失去焦点时重新变为文本
- input.blur(function() {
- //获得新输入的类别名
- var newText = $(this).val();
- //用新的类别名文字替换之前变过来的输入框状态
- objTD.html(newText);
- //获取该类别名所对应的ID(bigclassid)
- var bigclassid = objTD.prev().text();
- //将新的类别名进行转码,不然界面以及数据库显示的都是"???"这样的乱码
- newText = escape(newText);
- //获取要传到"一般处理文件"(update_bigclassname_2.php)中的URL
- var url = "update.php?id=" + bigclassid + "&bigclassname=" + newText;
- //AJAX异步更改数据库,data为成功后的回调返回值,用于显示提示信息
- $.get(url, function(data) {});
- });
- });
- });
- </script>
相关推荐
jQuery无刷新实时修改输入框中的文本并保存,可以把input数据在不经过数据读取的情况下及时修改,增强用户体验,确认修改后再上传数据库。 这种功能估计大家以前都见到过的,特别是在一些用户体验比较好的CMS系统...
jQuery表格插件无刷新表格控制分页显示数据
jQuery实现表格的增加、修改、删除、保存代码
用jquery做的表格无刷新排列,非常简单,你的要求不高时,可以用用
内容索引:脚本资源,jQuery,无刷新修改 jQuery无刷新实时修改网页Input的内容,可以把input数据在不经过数据读取的情况下及时修改,增强用户体验,确认修改后再上传数据库。 这种功能估计大家以前都见到过的,...
使用jQuery实现动态可编辑表格,代码更少,兼容性更好
jQuery实现表格动态修改和隐藏jQuery实现表格动态修改和隐藏jQuery实现表格动态修改和隐藏
jquery实现表格排序,绝对实用。jquery实现表格排序,绝对实用。
VS2008 编写 基于Jquey ajax 开发的表格控件 能够自定义表头,编辑、添加、删除、统计 数据全都是 json 格式 还能实现 在 表格里插入时间
jQuery AJAX表格控件(初版)源码 测试版 JQUERY 实现的AJAX表格操作控件 设计上需要改进 初步功能已实现 边个实现了数据库的添加 编辑 删除等基本功能 详细请查看代码
利用jquery实现表格动态分页,前台用jquery实现。后台用java实现动态查询数据,分页。
代码简介:jQuery不刷新分页动态数据表格代码是一款实用的jquery表格插件。
主要介绍了jQuery实现动态添加、删除按钮及input输入框的方法,涉及jQuery事件响应及页面元素动态操作相关实现技巧,需要的朋友可以参考下
一个简单的 jquery 两个表格数据行交换数据的功能源码
jquery 表格插件 带分页动 态数据表格 代码 仿excel修改 仿excel表格 仿excel操作
本人前端小白,因为项目需求,需要动态编辑表格,但是layui的编辑表格只适合 【有数据】修改功能用,并不适合【无数据】新增的功能使用,所以本人研究了几日,才写出了这么一个 无数据绑定,当然也可以自行绑定数据...
如何使用jquery固定表格行列,固定table表头。
引入js文件 [removed][removed] [removed][removed] [removed][removed] [removed][removed] ... 这是一款可以设置表格数据,每行,每页多个数据表格的jQuery表格数据分页插件代码。
一款简单实用的jQuery动态表格数据分页插件,动态获取表格数据,支持自定义设置分页参数。
ayGrid是一个基于jQuery的表格插件,可实现在表格上在线修改、增加、删除、保存数据!其中,单元格的编辑可以实现CheckBox、ComboBox、Input的输入方式。表格数据传输基于JSON。