可编辑的表格 - 普通的开发者 - ITeye博客

`

kennethf6986

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

最近访客更多访客>>

xuxq126

jeeter

zhaokui

liudanaodai

博主相关

博客

微博

相册

收藏

留言

关于我

文章分类

社区版块

存档分类

最新评论

zt3124： ConfigManager，Struts2Utils分别都是那 ...
使用java修改文本文件内容的问题
hcwj2009： import java.io.RandomAccessFile ...
使用java修改文本文件内容的问题
hcwj2009： import java.io.RandomAccessFile ...
使用java修改文本文件内容的问题
shingo7：楼主,麻烦你把你的联系方式短消息给我可以到我这里来试试根据 ...
这样的公司，还要不要继续下去
liwenshui322：还行吧，我现在一个月才1天休息呢。
这样的公司，还要不要继续下去

可编辑的表格

博客分类：

javascript

JavaScript HTML

阅读更多

<html>
	<head>
		<script type="text/javascript">
			
			function setToInput(){
				var oNode=event.srcElement;
				if(oNode.childNodes.length<1) return;
				var oInput=document.createElement("INPUT");
				oInput.type="text";	
				oInput.onblur=setToTD;
				oInput.size=5;
				oNode.appendChild(oInput);
				oInput.value=oNode.innerText;
				oNode.childNodes[0].removeNode();	
				oInput.focus();
				oInput.select();
			}
			
			function setToTD(){
					var oNode=event.srcElement;
					if(oNode.tagName=="INPUT"){
						var oValue=document.createTextNode(oNode.value);
						if(oValue&&oValue.nodeValue){
							oNode.parentNode.innerText = oValue.nodeValue;
						}else{
							oNode.parentNode.innerText = " ";
						}
						oNode.removeNode();
					}
			}				
		</script>		
	</head>
	
<body>
<h5>可编辑的表格</h5>
<table border=1>
	<tr>
		 <td height='25px' width='50px'  align='center' onclick="setToInput();">0</td>	
		 <td width='30px' onclick="setToInput();">2</td>
	</tr>	
	<tr>
		 <td onclick="setToInput();">2</td>	
		 <td onclick="setToInput();">2</td>		
	</tr>	
</table>
</body>
</html>

分享到：

跆拳道WTF和ITF的区別 | js全角字符转为半角大写

2010-08-27 09:05
浏览 822
评论(0)
分类:Web前端
查看更多

评论

发表评论

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

相关推荐

可编辑表格: 可编辑表格，编辑表格内容保存编辑的内容

bootstrap插件_table可编辑表格_demo: bootstrap插件_table可编辑表格_demo，集成插件对表格可编辑以及小插件的使用

vue+iview 实现可编辑表格的示例代码: 先简单说明一下,这个Demo...IViewEditTable ## vue+iview 实现的可编辑表格 └── index.html ## 首页 └── js └── editTable.js ## 首页JS └── ivew ## iview相关 └── vue ├── axios.min.js ## a

vue可编辑表格: 基于vue的可编辑表格很多时候我们需要直接编辑表格内容，这个组件刚好解决了需求

Vue封装的可编辑表格插件方法: 今天小编就为大家分享一篇Vue封装的可编辑表格插件方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧

jquery可编辑表格插件: jquery可编辑表格插件,简单好用,做列表时一个非常不错的选择

EXT 可编辑表格的例子: EXT 可编辑表格的例子 EXT 可编辑表格的例子

bootstrap可编辑表格完整代码: bootstrap可编辑表格，包含编辑单元格文本、日期类型、下拉框(代码可运行)

原创-javascript服务器交互型可编辑表格和我的js常用库: 自己常用的js库和写的一个交互型可编辑表格: BaseJs库的一点源码: /** * 自定义javascript常用基础库 author zhang_jhai 创建时间 2010/04/10 最后修改时间 2010/05/03 * version 2.0 */ // Base库基础类 BaseJs ...

matlab开发-TLAB中的可编辑表格: matlab开发-TLAB中的可编辑表格。可添加到图形中的表格；可编辑和滚动。

jQuery+PureCSS可编辑表格插件: 这是一款十分简单的jQuery+PureCSS实现的可编辑表格插件，点击table表格的单元格对文字内容进行修改，再在单元格外随意点击一下即可保存。

VC6.0中基于MSFlexGrid的可编辑表格的制作及其若干问题的解决方案C++源: VC6.0中基于MSFlexGrid的可编辑表格的制作及其若干问题的解决方案C++源

jQuery实现可编辑表格: jQuery实现可编辑化的表格，有兴趣的可以看看

可编辑表格js代码: 非常方便，非常好用的修改表格代码。哪里要用直接拉过去就可以了，非常好用。

ext可编辑表格: ext可编辑表格Ext.onReady(function() { Ext.QuickTips.init(); //格式化日期 function formatDate(value) { return value ? value.dateFormat('Y年m月d日') : ''; } // 别名 var fm = Ext.form; //...

js可编辑表格样表: js可编辑表格样表,可对列表进行新增、删除、修改操作

【JavaScript源代码】vue 中使用 vxe-table 制作可编辑表格的使用过程.docx: vue 中使用 vxe-table 制作可编辑表格的使用过程　项目上有一个表格需要实现在线编辑，开始用了 element 的el-table 实现，单元格内基础情况就是监听了单击单元格切换一个span标签与input标签，复杂点的单元格使用...

基于jquery的可编辑表格实现代码: 双击表格元素TD时，在其中嵌入INPUT对象并接收TD元素数据，进行编辑后失焦点时数据由INPUT对象回送到TD元素。

jQuery自适应PC手机端可编辑表格代码.zip: <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,... 一款简洁实用的自适应PC手机端的jQuery可编辑表格代码，jQuery表格添加删除行数据代码，使用起来十分的方便。

Global site tag (gtag.js) - Google Analytics