Requirement: the original JQ framework table function should be improved in the project to implement cell-click editing.
Idea: traverse the generated table in JS to dynamically Add a click event to TD.
Problem: During traversal and addition, you can add attributes to the style of TD. However, if you want to add an event, you cannot add it.
1 // text control template 2 var texttemp = "<input type = \" text \ "value = {0}/>"; 3 var rawdata; // raw data 4 // JS control column can be modified 5 $ ("TR", $. pdialog. getcurrent ()). each (function () {6 var TR = This; 7 // exclusive table header 8 if ($ (TR ). parent () [0]. nodename! = "Thead") {9 var Index = 0; 10 $ (TR ). find ("TD "). each (function () {11 var TD = This; 12 // specific column 13 if (Index = 2 | Index = 4 | Index = 5) {14 keys (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 // retrieve the original cell value 28 rawdata = trim ($ (TD ). find ("Div" ).html (); 29 // Add a text control to the cell 30 $ (TD ). find ("Div" pai.html (""); 31 $ (TD ). find ("Div" cmd.html (texttemp. format (STR); 32 // set the focus of the cursor 33 $ (TD ). find ("input "). foucs (); 34 35 $ (TD ). find ("input "). val (rawdata); 36 // Add a focus loss event delete text AAAAA this box modify Div content under Td 37} 38
Solution: wit me directly to TD. ATTR ("onclick", "javascript: tdedit ();"); hope there is a better way to complete it later