Jquery php 点击td变成input,修改后失去焦点发送数据
html部分
<Td><?php echo $row['bigclassid']?></Td>
<td height="25" width="241" class="bigclassname"><?php echo $row['bigclassname']?></a></td>
Js部分
<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_bigclassname_2.php?bigclassid=" + bigclassid + "&bigclassname=" + newText;
//AJAX异步更改数据库,data为成功后的回调返回值,用于显示提示信息
$.get(url, function(data) { alert(data) });
});
});
});
</script>
更新数据库的过程就是普通的php程序
本例要用到jquery请自行下载后调试
原文地址:http://www.corange.cn/archives/2010/04/3576.html
转载于:https://www.cnblogs.com/zerogo/archive/2010/04/12/2209082.html
Jquery php 点击td变成input,修改后失去焦点发送数据相关推荐
- element-ui 表格 修改后, 表格里面的数据 页面不实时更新问题 完美解
element-ui 表格 修改后 表格里面的数据后 页面不实时更新问题 完美解 想要达到的效果:点击"更多"后,"更多"隐藏,删除和补仓显示:(有时间可全部看 ...
- 小程序input提交后如何清空输入框数据:小程序与Vue的数据绑定方式
前言 一直觉得,小程序与Vue有着神似之风.这一点在我第一天开始接触小程序时就这么认为,或者说,任何前端相关的语言,不管是node.js.Vue.angular.小程序,都和js有着千丝万缕的联系. ...
- html中加减号怎么输入,jQuery 实现点击加减号改变input标签中的value值,该怎么解决...
jQuery 实现点击加减号改变input标签中的value值 我想点击左右两边的加减号,让中间input标签中的value属性值做出相应的改变,jQuery怎么实现? ------解决思路 ...
- html表单框内文字点击消失,jQuery 使用label实现点击表单input,提示文字消失的示例...
感兴趣的小伙伴,下面一起跟随512笔记的小编罗X来看看吧. 很多网站在填写表单的时候,都可以看到这样一种UI,input[type=text]里面有提示的文字,当鼠标点进去之后提示文字就消失了.以前做 ...
- jquery 文件上传 触发两次_点击三次input按钮,前两次不选择任何文件,第三次选择一个文件,结果上传了3个文件,即发生了三次请求...
点击三次input按钮,前两次不选择任何文件,第三次选择一个文件,结果页面上出现了3个文件,也就是上传了3个文件 我点击input,不选择任何文件,然后取消文件选择器的窗口,然后第二次次点击input ...
- 关于jquery实现点击a链接,跳转之后,该a链接处样式的修改
本来一般的列表标签都是直接给点击的li标签修改样式就可以了,直接用if判断语句就是可以的. 但是有的时候项目是别人写的,要来进行bug修复之类的,或者在开发中遇到类似的问题都可以这样解决的,我就是在改 ...
- jquery 实现点击图片居住放大缩小
jquery 实现点击图片居住放大缩小 该功能是基于jquery实现的,所以 第一步则是引入jquery jquery下载地址:https://jquery.com/download/ 或者使用此时调 ...
- JQuery选择器 点击背景变色、光棒效果、焦点、添加元素
HTML部分 <style>.moucolor{background-color:red;} </style> <body><!--点击背景变色-->& ...
- 汇总常用的jQuery操作Table tr td方法
2019独角兽企业重金招聘Python工程师标准>>> 1.鼠标移动行变色 方法一:jQuery中的hover(fun(),fun())方法,参数一:第一个方法是添加样式功能,参数二 ...
最新文章
- 7000更换控制器电源步骤_恒温恒湿试验箱几大故障的检查步骤及解决方法说明...
- mysql etc my.cnf_mysql配置文件 /etc/my.cnf 详细解释
- 用jedis访问Redis进行对象存取示例
- oracle给每行加上序号,Oracle 根据分类字段给查询结果添加序号
- php7和php8内核有区别吗,不要在PHP7中踩这些坑
- fatal error LNK1169: 找到一个或多个多重定义的符号 的解决方案
- mysql中什么叫临时表_MySQL中使用临时表需要注意哪些?
- 报表服务扩展:基于WCF技术的报表服务扩展
- PhpYun人才系统 整合 Ucenter 之后,会员注册提示”该 Email 已经被注册!“的解决方案
- 决战双十一,促销海报设计模板,学习起来
- node.js入门 - 7.异常处理与多进程开发
- Mysql 数据库中Where 关键字的使用
- EIGRP sutb
- 机器人学从理论、设计到建模仿真零基础入门教程(硬核、偏零基础)
- MT2601智能穿戴芯片处理器参数介绍
- 生物信息学简史,A brief history of bioinformatics- Briefings in Bioinformatics综述解读
- gmap 支持python吗_Python:地图上的标记标签使用gmap.marker_层使用hover_-tex选项不工作...
- obs显示从服务器断开连接,obs重新连接到服务器
- RecyclerView 报Scrapped or attached views may not be recycled. as Scrap:false isAttached:true异常
- 史上最全数据库笔记(上)