基于jquery的高性能td和input切换并可修改内容实现代码
更新时间：2011年01月09日 23:32:29 作者：
在实际工作中，我们会碰到这样一个情况。在页面中显示着100个数据，同时用户还希望他可以更改其中的数据，普通的方式可能如下
在之前的基础上，添加方向键左右支持。
在实际工作中，我们会碰到这样一个情况。在页面中显示着100个数据，同时用户还希望他可以更改其中的数据，普通的方式可能如下，
这种方式会出现一个问题，就是页面显示的时候有点慢，同时如果有滚动条的话，会有些卡。下面给出我的一个解决方法，显示的时候全是td的，没有input标签，如下
当你点击其中一个td时，就会出现下面这样
当你点击td的时候，会在td动态加入一个input同时把td的值赋给input，当你鼠标离开input时，会把input的值赋给td。同时支持回车，上下方向键，进行向右，上下移动。
可以对这个做一些扩展，做出一些很实际的功能，（对大批量数据编辑等等）。不多说了，附上源码，仅供参考。
在线演示地址http://demo.jb51.net/js/td_input_edit/index.htm
打包下载地址http://xiazai.jb51.net/201101/yuanma/td_input_edit.rar
相关文章
判断背景图片是否加载成功想必大家对此很陌生吧，会了之后就可以判断css背景图片了，具体判断代码如下，感兴趣的朋友可以参考下哈2013-05-05
这篇文章主要为大家详细介绍了JavaScript中参数传递三种方式：按值传递、引用传递和共享传递,文中的示例代码讲解详细,感兴趣的可以了解下2023-09-09
jacascript DOM节点——元素节点、属性节点、文本节点
这篇文章主要介绍了jacascript DOM节点——元素节点、属性节点、文本节点,需要的朋友可以参考下2017-04-04
这篇文章主要介绍了Javascript URI 解析介绍,本文直接给出代码示例,需要的朋友可以参考下2015-03-03
所有浏览器在下载JS的时候，会阻止一切其他活动，比如其他资源的下载，内容的呈现等等。至到JS下载、解析、执行完毕后才开始继续并行下载其他资源并呈现内容。2010-05-05
这篇文章主要介绍了JavaScript实现兼容IE6的收起折叠与展开效果,结合具体实例形式分析了javascript事件响应及针对页面元素属性的动态操作相关实现技巧,需要的朋友可以参考下2017-09-09
这篇文章主要介为大家详细绍了Bootstrap CSS布局之按钮的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-12-12
Fetch API是一种用于进行网络请求的现代JavaScript API，提供了更简洁、强大和灵活的方式来处理异步数据交互，本文主要为大家介绍了js中js中基本用法，感兴趣的同学可以参考下2023-07-07
这篇文章主要介绍了浅谈document.write()输出样式，十分的简单实用，有需要的小伙伴可以参考下。2015-05-05
这篇文章主要介绍了javascript在IE下trim函数无法使用的解决方法,分别叙述了javascript以及jQuery下的解决方案,对于WEB前端javascript设计人员进行浏览器兼容性调试有不错的借鉴价值,需要的朋友可以参考下2014-09-09
最新评论