動態給表格TD 添加單擊事件

需求:項目中對原有的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();"); 希望有更好的方法 后面再完善

轉載于:https://www.cnblogs.com/northsea/p/3867840.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。如若轉載,請注明出處:https://dhexx.cn/hk/18311.html

如若內容造成侵權/違法違規/事實不符,請聯系我的編程經驗分享網進行投訴反饋,一經查實,立即刪除!


相關文章:

  • Spring三級緩存解決循環依賴
  • SPARK-SQL - Column相關的api操作大全
  • 【Demo 0014】網絡編程(ASI API)
  • 花布條錯誤案例
  • SPARK-SQL - sort排序相關的api大全
  • SPFA算法學習筆記
  • Java 8 新特性Lambda 表達式
  • 天將降大任于斯人也,必先苦其心志,勞其筋骨,餓其體膚,空乏其身,行拂亂其所為,所以動心忍性,增益其所不能...
  • SPARK-SQL - group分組聚合相關的api,groupBy().count(),groupBy().avg()等
  • MySQL創建定時任務
  • hdu 4657 Find Permutation
  • SPARK-SQL - group分組聚合api,agg()
  • SpringBoot整合lettuce+RedissonSentinel(哨兵模式)
  • C++大數類模板
  • matlab 中txt文件(含字符及數值)處理
  • SPARK-SQL - groupBy分組聚合相關的api,pivot實現行轉列
  • 輕松搞懂Java中的自旋鎖
  • SPARK-SQL - join關聯的api
  • NetworkManager 命令配置nmcli注意
  • HDU 4662 MU Puzzle 數論或者水題
  • Linux服務器使用Scp命令將數據拉取和接收到遠程服務器
  • C# 窗體間傳值方法大匯總
  • 第三方過濾器在TVideoGrabber中的使用
  • java獲取系統變量之System.getenv()和System.getProperty()
  • Jmeter壓測工具入門測試使用
  • [轉]Android讀寫文件
  • 一些食物的酸堿性
  • Spark Streaming入門 - 從Socket接收數據 實現wordCount統計單詞個數
  • Linux下使用Crontab定時執行腳本及多種案例
  • 怎樣安裝和制作淘寶店鋪裝修掛件
  • jdbcTemplate的學習經歷
  • Java正則表達式入門學習與實踐
  • Java:集合,Collection接口框架圖
  • Spark Streaming入門-編程入口JavaStreamingContext的實例化,構造方法匯總
  • IOS-synthesize和dynamic的異同(轉)
  • V8 API Reference Guide
  • Hadoop的內置的基本數據類型
  • Java中String的replace、replaceAll和replaceFirst方法
  • 【數據庫復習】第二章關系數據庫2
  • GhostDoc的使用
  • HDU 4870Rating(推公式)
  • spark常用RDD算子 - saveAsTextFile、saveAsObjectFile 可保存到本地文件或hdfs系統中
  • Linux服務器編輯jar包并重新運行與直接修改jar包
  • hdu 4686 Arc of Dream(矩陣快速冪)
  • 糾結的CLI C++與Native C++的交互
  • kafka概述,架構說明,相關的名詞解釋
  • JAVA基礎知識
  • 棧Stack和段寄存器SS,SP(學習匯編)
  • 【轉載】Linux下動態共享庫加載時的搜索路徑詳解
  • Linux下打包和解壓zip文件