码迷,mamicode.com
首页 > 其他好文 > 详细

动态给表格TD 添加单击事件

时间:2014-07-25 16:35:01      阅读:238      评论:0      收藏:0      [点我收藏+]

标签:style   blog   java   color   数据   io   for   re   

需求:项目中对原有的JQ框架表格功能要进行完善 实现 单元格单击编辑

思路:JS中遍历生成好的表格 动态给TD 添加单击事件.

问题:遍历添加时,给TD 加样式 加属性都可以 但是如果要加单击事件 死活加不上去.

 1 //文本控件模版
 2 var textTemp = "<input type=\"text\" value={0} />";
 3 var RawData; //原始数据
 4     //js控制列 可修改
 5 $("tr", $.pdialog.getCurrent()).each(function () {
 6     var TR = this;
 7     //排除表头
 8     if ($(TR).parent()[0].nodeName != "THEAD") {
 9         var index = 0;
10         $(TR).find("td").each(function () {
11             var TD = this;
12             //具体列
13             if (index == 2 || index == 4 || index == 5) {
14                 $(TD).css("cursor", "pointer");
15                 //$(TD).click(function(){ alert(1); });
16                 $(TD).attr("onclick", "javascript:TdEdit(this);");
17             }
18             index++;
19 
20         });
21     }
22 
23 });
24 
25 function TdEdit(TD) {
26     debugger;
27     //取出原先单元格中的值
28     RawData = trim($(TD).find("div").html());
29     //给单元格添加一个文本控件
30     $(TD).find("div").html("");
31     $(TD).find("div").html(textTemp.format(str));
32     //光标设置焦点
33     $(TD).find("input").foucs();
34 
35     $(TD).find("input").val(RawData);
36     //添加失去焦点事件 删除文aaaaa本框 修改td下div内容
37 }
38    

 

解决方法:机智的我 直接给TD.attr("onclick","javascript:TdEdit();"); 希望有更好的方法 后面再完善

动态给表格TD 添加单击事件,布布扣,bubuko.com

动态给表格TD 添加单击事件

标签:style   blog   java   color   数据   io   for   re   

原文地址:http://www.cnblogs.com/northsea/p/3867840.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!