jquery表格可编辑修改表格里面的值,点击td变input无刷新更新表格
td点击后变为input可以输入,更新数据,无刷新更新

- <table border="0" cellpadding="0" cellspacing="0">
- <tr>
- <th><a href="http://www.freejs.net">freejs.net演示</a></td>
- <th scope="col">列1</th>
- <th scope="col">第二列</th>
- <th scope="col">其他</th>
- </tr>
- <tbody>
- <?php
- require "conn.php";
- $sql="select * from `add_delete_record` where id>0";
- $rs=mysql_query($sql);
- if ($row = mysql_fetch_array($rs))
- {
- do {
- ?>
- <tr>
- <th><?php echo $row['id']?></th>
- <td class="content"><?php echo $row['content']?></td>
- <td class="text"><?php echo $row['text']?></td>
- <td class="position"><?php echo $row['position']?></td>
- </tr>
- </Tr>
- <?php
- }
- while ($row = mysql_fetch_array($rs));
- }?>
- </tbody>
- </table>
- 注意:5个字符以上数据库不能添加
- <script type="text/javascript" src="../../js/jquery-1.9.1.min.js"></script>
- <script type="text/javascript">
- $(function(){
- $('table td').click(function(){
- if(!$(this).is('.input')){
- $(this).addClass('input').html('<input type="text" value="'+ $(this).text() +'" />').find('input').focus().blur(function(){
- var thisid = $(this).parent().siblings("th:eq(0)").text();
- var thisvalue=$(this).val();
- var thisclass = $(this).parent().attr("class");
- $.ajax({
- type: 'POST',
- url: 'update.php',
- data: "thisid="+thisid+"&thisclass="+thisclass+"&thisvalue="+thisvalue
- });
- $(this).parent().removeClass('input').html($(this).val() || 0);
- });
- }
- }).hover(function(){
- $(this).addClass('hover');
- },function(){
- $(this).removeClass('hover');
- });
- });
- </script>
update.php
- <?php
- require "conn.php";
- $id = trim($_REQUEST['thisid']);
- $thisclass = trim($_REQUEST['thisclass']);
- $thisvalue= trim($_REQUEST['thisvalue']);
- if (substr_count($thisclass," ")>0){
- $thisclass=str_replace(" ","",$thisclass);
- }
- if (substr_count($thisclass,"input")>0){
- $thisclass=str_replace("input","",$thisclass);
- }
- $update_sql = "update add_delete_record set $thisclass='$thisvalue' where id='$id'";
- $result = mysql_query($update_sql);
- ?>
原文地址:
http://www.freejs.net/article_biaodan_34.html
jquery表格可编辑修改表格里面的值,点击td变input无刷新更新表格的更多相关文章
- [转]jquery 点击表格变为input可以修改无刷新更新数据
原文地址:http://www.freejs.net/article_biaodan_43.html 之前已经发了2篇类似的文章<点击变td为input更新>和<jquery表格可编 ...
- EF修改对象里面的值。。。(对象字段多的时候)
后台代码 public ActionResult Edit(my m)//my实体类 { testEntities t = new testEntities();//数据库上下文 t.my.Attac ...
- 微信小程序 this.setData 修改json里面的值
page({ data:{ s1:{a:"",b:"b"} }, changeData:function(e){ var cData=this.data.s1; ...
- Activity往另外一个Activity传值,Fragment获取另外一个Activity里面的值。
在oneActivity中实现跳转到MainActivity //intent 用来跳转另外一个MainActivity,bundle传值到MainActivity Intent Ma ...
- js获取单选框里面的值
rt,如果想获取单选框里面的值,该如何获取呢. <script> window.onload = function(){ //通过名字获取 getElementsByName //var ...
- javaWeb中怎么获取提交表单里面的值
在javaWeb中如何获得html文件中的表单里面的值? <!DOCTYPE html> <html> <head> <meta charset=" ...
- 提取数据库字段里面的值,并改变+图片懒加载,jquery延迟加载
要求:手机端打开某个页面的详细信息,因为网速或者别的原因,响应太慢,因为图片大的原因,希望先进来,图片在网页运行的情况再慢慢加载(jquer延迟加载) http://www.w3cways.com/1 ...
- 微信小程序--修改data数组或对象里面的值
1.初始data数据 Page({ data:{ code:'1234', reward:[{ name:"艾伦" ...
- win8 修改msconfig 里面的"引导高级选项" 最大内存后 BSOD的解决方案
最近由于本人的电脑一直非常卡,于11.4日通过win8任务管理器分析发现 Peer Name Resolution Protocol Peer Networking Grouping Peer Net ...
随机推荐
- codeforces 21D. Traveling Graph 状压dp
题目链接 题目大意: 给一个无向图, n个点m条边, 每条边有权值, 问你从1出发, 每条边至少走一次, 最终回到点1. 所走的距离最短是多少. 如果这个图是一个欧拉回路, 即所有点的度数为偶数. 那 ...
- 使用verilog实现4选1数据选择器的几种方法
第一种方法module mux( d1, d2, d3, d4, se1, se2, dout ); input d1; input d2; input d3; input d4; input se1 ...
- STL容器的内存分配
这篇文章参考的是侯捷的<STL源码剖析>,所以主要介绍的是SGI STL实现版本,这个版本也是g++自带的版本,另外有J.Plauger实现版本对应的是cl自带的版本,他们都是基于HP实现 ...
- iphone:自定义UIAlertView
由于项目中有这样一个需求:需要在保存是弹出框选择保存的地点.选择UIAlertView来实现,但是要在UIAlertView中增加UISwitch的控件,这就需要自定义一个继承UIAlertView的 ...
- android ndk jni 环境搭建
关于ndk jni网上的介绍很多,其实我了解这个主要是因为自己是做嵌入式的,一则是对C语音有感情 二则是知道jni 可以绕过framework 框架直接操作硬件抽象层. 1.概述 对于ndk, j ...
- Ubuntu eclipse :An error has occurred. See the log file
安装eclipse: sudo apt-get install eclipse-platform 调整java: sudo update-alternatives --config java 启动: ...
- WIX 学习笔记- 1 简介
一个项目 Code Complete 后,程序员们欢欣鼓舞,以为事情到此结束,可以 Happy 了.其实 Code Complete 五十之于百里.一个没有运行在设备上,为人们创造价值的项目是注定失败 ...
- poj2190
#include <stdio.h> #include <stdlib.h> int main() { ]; ,i; scanf("%s",arr); ;i ...
- oracle11g ora-12514监听程序当前无法识别
环境:win7_x64 ,oracle11g 描写叙述:1第一天没问题,第二天就不能连接: 2:pl sql developer连接工具,自己安装的oracle数据库,又装了client 3:装了or ...
- 权威指南之脚本化jquery
jqury函数 jquery()($())有4种不同的调用方式 第一种是最常用的调用方式是传递css选择器(字符串)给$()方法.当通过这种方式调用时,$()方法会返回当前文档中匹配该选择器的元素集. ...