代码重构七

2014年3月5日 08:50:30

工作上需要动态添加表格的记录，然后删除部分。

js如下：

/*
 * 
 *---------
 *2014-03-04 16:40:38
 *新增tr
 *----------
 */

 function insRow(){
     
     var ta =document.getElementById("productTable");
     var i=ta.rows.length;
     //行
     var newRow = ta.insertRow(i);    

     //设置行的属性
     //ie不支持此设置
    // newRow.setAttribute('onclick','changeColor()');
     newRow.onclick = changeColor;
     //单元格
     var newTd0= newRow.insertCell(0);
      var newTd1= newRow.insertCell(1);
       var newTd2= newRow.insertCell(2); 
        var newTd3= newRow.insertCell(3);
        
         var newTd4= newRow.insertCell(4);
      var newTd5= newRow.insertCell(5);
       var newTd6= newRow.insertCell(6); 
        //单元格的内容
         
       newTd0.innerHTML=i;
       newTd1.innerHTML="<input type='text' value='' name='sp_ProductNo[]'  />";
       newTd2.innerHTML="";
       newTd3.innerHTML="";
        newTd4.innerHTML="";
         newTd5.innerHTML="<input type='text' value=''  name='sp_Amount[]' />";
          newTd6.innerHTML="<input type='text' value=''  name='sp_Remark[]' />";
           
     }

/*
  *---------
  *2014-03-04 17:27:41
  *点击改变tr的颜色
  *--------------
  */

  function changeColor(){

    $(this). toggleClass("highLight"); 
    
      }

/*
 * -----------
 *2014-03-05 08:39:07
 *删除tr
 *对原来的要重新排序，否则行号乱了
 *-------------------
 *
 */
 function deleRow(){
     $("tr[class='highLight']").each(function(){
         $(this).remove();
         });
     }

 

/*
 *----------- 
 *2014-03-05 08:49:47
 *对表格行号排序
 *------------------
 *
 */
 function sortRow(){
             var i=1;
     $("#productTable  tr td:first-child").each(function(){
            $(this).html(i);
            i++;

         });
     }

 

 

2014年3月5日 10:45:22

 

 

页面post过来的数组，无法直接[]访问

 

 $this->input->post('sp_ProductNo') 是数组，直接在后面添加[0] 报错。

解决的方法是： 先存为变量，再访问就正常

 

2014年3月5日 15:19:02

 

今天遇到一个问题，表格的tr上无法执行onclick事件

<tr onClick="changeColor()">

见鬼啊。。。暂时没看出错在哪，等待后期解决吧

 

2014年3月5日 15:33:25  发现了错误的根源。 js的changeColor方法，没有传递事件的元素，

之前该方法是 用js添加到tr上，无需传递 元素。

解决方法： 另写一个方法，下班后研究 如何整合到一起。

/*
  *---------
  *2014-03-04 17:27:41
  *点击改变tr的颜色
  *2014-03-05 15:30:04
  *需要修改,js添加下面的函数，不需要传递元素。可以通过 this 获取
  * 但是不是该函数直接添加到tr属性上，则需要参数 。
  *解决办法：重写一个方法
  *--------------
  */

  function changeColor(){

     
    $(this). toggleClass("highLight"); 
    
      }
  function changeTrColor(element){
      $(element). toggleClass("highLight"); 
      }