JQueryInplaceEdit

wangyu

浏览: 1357701 次
性别:
来自: 北京

最近访客更多访客>>

akingde

小强199184

dondavid

laughing_yang

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

JavaScript

jQuery HTML 浏览器

$(document).ready(function() {
			var tds = $("td");
			tds.click(tdclick);
		});
function tdclick() {
	//找到所有的td节点
	var td = $(this);
	
	//获得当前的this对应的节点的值
	var text = td.text();
	
	//清空td的内容
	td.html("");
	
	//建立一个文本框,也就是input的元素节点
	var input = $("<input>");
	
	//设置文本框的值是保存起来的文本
	input.attr("value", text);
	
	//响应文本框失去焦点事件
	input.blur(function(event) {
				var inputnode = $(this);
				var inputtext = inputnode.val();
				var tdNode = inputnode.parent();
				tdNode.html(inputtext);
				tdNode.click(tdclick);
			});
	//响应键盘按下事件
	input.keyup(function(event) {
		
				//解决不同浏览器获取事件对象的差异
				var myEvent = event || window.Event;
				
				//获得键盘的keyCode
				var kcode = myEvent.keyCode;
				
				//判断是否是回车
				if (kcode == 13) {
					
					//获得文本框,返回一个jquery对象
					var inputnode = $(this);
					
					//获得文本框的值
					var inputtext = inputnode.val();
					
					//获得文本框的父节点,也就是td
					var tdNode = inputnode.parent();
					
					//设置td的值为文本框取到的值
					tdNode.html(inputtext);
					
					//重新拥有点击事件
					tdNode.click(tdclick);
				}
			});
	//将文本框加入到td中
	td.append(input);
	
	//通过jquery对象获得dom对象
	var inputdom = input.get();
	
	//文本框的文本为选中状态
	inputdom.select();
	
	//清楚td上的点击事件
	td.unbind("click");
}

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>jqueryEdit.html</title>

		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="this is my page">
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">

		<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
		<script type="text/javascript" src="js/jquery.js"></script>
		<script type="text/javascript" src="js/jqueryEdit.js"></script>

		<link type="text/css" rel="stylesheet" href="css/jqueryEdit.css" />

	</head>

	<body>
		<table>
			<tbody>
				<tr>
				<td>1231123</td>
				<td>456456</td>
				</tr>
			</tbody>
		</table>
	</body>
</html>

分享到：

json lib | checkbox 全选和取消全选

2009-02-15 10:43
浏览 1349
评论(0)
查看更多

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

linux基础进阶笔记: linux基础进阶笔记，配套视频：https://www.bilibili.com/list/474327672?sid=4493093&spm_id_from=333.999.0.0&desc=1

IMG20241115211541.jpg: IMG20241115211541.jpg

Sen2_ARI_median.txt: GEE训练教程——Landsat5、8和Sentinel-2、DEM和各2哦想指数下载

毕业设计&课设_基于 flask-whoosh-jieba 的代码，涉及文件管理及问题修复.zip: 该资源内项目源码是个人的课程设计、毕业设计，代码都测试ok，都是运行成功后才上传资源，答辩评审平均分达到96分，放心下载使用！ ## 项目备注 1、该资源内项目代码都经过严格测试运行成功才上传的，请放心下载使用！ 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习，也适合小白学习进阶，当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行，也可在此代码基础上进行修改，以实现其他功能，也可用于毕设、课设、作业等。下载后请首先打开README.md文件（如有），仅供学习参考, 切勿用于商业用途。

基于springboot家政预约平台源码数据库文档.zip: 基于springboot家政预约平台源码数据库文档.zip

Ucharts添加stack和折线图line的混合图: Ucharts添加stack和折线图line的混合图

基于springboot员工在线餐饮管理系统源码数据库文档.zip: 基于springboot员工在线餐饮管理系统源码数据库文档.zip

2015-2021年新能源汽车分地区、分类型、分级别销量逐月数据和进出口数据-最新出炉.zip: 新能源汽车进出口数据 1、时间跨度:2018-2020年 2、指标说明:包含如下指标的进出口数据:混合动力客车(10座及以上)、纯电动客车(10座及以上)、非插电式混合动力乘用车、插电式混合动力乘用车、纯电动乘用车二、新能源汽车进出口月销售数据(分地区、分类型、分级别) 1、数据来源:见资料内说明 2、时间跨度:2014年1月-2021年5月 4、指标说明: 包含如下指标 2015年1月-2021年5月新能源乘用车终端月度销量(分类型)部分内容如下: 新能源乘用车(单月值、累计值 )、插电式混合动力月度销量合计(狭义乘用车轿车、SUV、MPV、交叉型乘用车); 月度销量同比增速(狭义乘用车轿车、SUV、MPV、交叉型乘用车); 累计销量合计(狭义乘用车轿车、SUV、IPV、交叉型乘用车); 累计销量同比增速(狭义乘用车轿车、SUV、MPV、交叉型乘用车); 累计结构变化(狭义乘用车轿车、SUV、IPV、交叉型乘用车); 2015年1月-2021年5月新能源乘用车终端月度销量(分地区)内容如下: 更多见资源内

中心主题-241121215200.pdf: 中心主题-241121215200.pdf

蓝奏云下载链接与密码整理: 内容概要：本文档提供了多个蓝奏云下载链接及其对应解压密码，帮助用户快速获取所需文件。适合人群：需要从蓝奏云下载文件的互联网用户。使用场景及目标：方便地记录并分享蓝奏云上文件的下载地址和密码，提高下载效率。阅读建议：直接查看并使用提供的链接和密码即可。若遇到失效情况，请尝试联系上传者确认更新后的链接。

Javaweb仓库管理系统项目源码.zip: 基于Java web 实现的仓库管理系统源码，适用于初学者了解Java web的开发过程以及仓库管理系统的实现。

Python-文件重命名-自定义添加文字-重命名: 资源名称：Python-文件重命名-自定义添加文字-重命名类型：windows—exe可执行工具环境：Windows10或以上系统功能： 1、点击按钮 "源原文"【浏览】表示：选择重命名的文件夹 2、点击按钮 "保存文件夹"【浏览】表示：保存的路径(为了方便可选择保存在源文件中 ) 3、功能①：在【头部】添加自定义文字 4、功能②：在【尾部】添加自定义文字 5、功能③：输入源字符；输入替换字符可以将源文件中的字符替换自定义的 6、功能④：自动加上编号_1 _2 _3 优点： 1、非常快的速度！ 2、已打包—双击即用！无需安装！ 3、自带GUI界面方便使用！

JDK8安装包,为各位学习的朋友免费提供: JDK8安装包

Centos-7yum的rpm包: 配合作者一同使用作者地址没有次下载路径 https://blog.csdn.net/weixin_52372189/article/details/127471149?fromshare=blogdetail&sharetype=blogdetail&sharerId=127471149&sharerefer=PC&sharesource=weixin_45375332&sharefrom=from_link

setup_python_geospatial_analysis.ipynb: GEE训练教程

毕业设计&课设_文成公主微信公众号全栈工程，含技术栈、架构及部署流程等内容.zip: 该资源内项目源码是个人的课程设计、毕业设计，代码都测试ok，都是运行成功后才上传资源，答辩评审平均分达到96分，放心下载使用！ ## 项目备注 1、该资源内项目代码都经过严格测试运行成功才上传的，请放心下载使用！ 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习，也适合小白学习进阶，当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行，也可在此代码基础上进行修改，以实现其他功能，也可用于毕设、课设、作业等。下载后请首先打开README.md文件（如有），仅供学习参考, 切勿用于商业用途。

基于springboot交通感知与车路协同系统源码数据库文档.zip: 基于springboot交通感知与车路协同系统源码数据库文档.zip

基于springboot+vue 雅妮电影票购买系统源码数据库文档.zip: 基于springboot+vue 雅妮电影票购买系统源码数据库文档.zip

使用 HTML5 实现拖放交互：音效与提示功能的完整实现: 为了更好地理解 HTML5 的拖放功能，我们设计了一个简单有趣的示例：将水果从水果区拖放到购物笼中，实时更新数量和价格，并在所有水果被成功放置后，播放音效并显示提示。

毕业设计&课设_基于 SSM 的大学生综合成绩测评系统（含信息及数据库脚本，体现系统架构及功能设计）.zip: 该资源内项目源码是个人的课程设计、毕业设计，代码都测试ok，都是运行成功后才上传资源，答辩评审平均分达到96分，放心下载使用！ ## 项目备注 1、该资源内项目代码都经过严格测试运行成功才上传的，请放心下载使用！ 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习，也适合小白学习进阶，当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行，也可在此代码基础上进行修改，以实现其他功能，也可用于毕设、课设、作业等。下载后请首先打开README.md文件（如有），仅供学习参考, 切勿用于商业用途。

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

JQueryInplaceEdit

评论

发表评论

相关推荐

j托管JavaScript类库

javascript日期相减

做个在网页上实现像QQ一样当有新任务时声音提醒

多选列表值的移动和获取值

获得多项选择列表框的选中选项

JS获取表格单元格

获得select的option值

javaScript urlencode 推荐 encodeURICompon

javaScript UrlEncode and UrlDecode

这就是个静态页面通过js控制mscomm对某com设备进行访问的例子.

js调用ocx控件(读写IC卡)

转换Unicode (JS)

JS获取当前对象大小以及屏幕分辨率等

单选框控制表单的隐藏和显示

支持IE6、IE7的关闭页面的函数

获取各种浏览器可见窗口大小

checkbox 全选和取消全选

JavaScript分割字符串

框架标签

XML+Javascript树状菜单

最近访客更多访客>>