最近用做的公司内部管理系统的工时管理,需求是要在table中随意添加、删除工作项,前台全部用js控制table ,所以用到了table中常用 的集中方法。

(1)得到table 中tbody 的内容 :$('#simple-table').find('tbody').html();

(2)点击td时,获取点击的行号:

                        $('#simple-table tbody').on( 'click', 'td', function (e) {

          normalRowIndex = $(this).parent().index(); //行号
console.log("正常工作表行:"+normalRowIndex);

});

(3)为table追加一行:

                 function addNormalTR(){
$('#simple-table').find('tbody').append(trtd); //tdtd为拼接的trtd 的html内容。

}

(4) 点击td中的元素获取,当前行号: obj.parentNode.parentNode.rowIndex;//obj 为元素对象

(5)点击table中td下的一个按钮删除当前行:

                  function delNormalTR(obj){//obj为点击的元素,传this过来就ok
//alert("点击的td的:"+obj.parentNode.parentNode.rowIndex);
//alert("当前行号"+normalRowIndex);
       var rowIndex =  obj.parentNode.parentNode.rowIndex;
if(rowIndex !=1 ){
  $('#simple-table tr:eq(' + rowIndex + ')').remove();
}

}

(6)  获取table 中各个对象的方法

        var trNode = $(this).parent().parent(); //获取input的“爷爷”--tr  
        var forthChildTdNode =  trNode.children().eq(3);//获取第四个td  

        var firstInput = forthChildTdNode.children(); //获取第一个input  

(7)遍历tr td 
       $('#simple-table tr').each(function(i){             // 遍历 tr
      var t ="";
          var projectid =  $('#simple-table tr:eq('+(i+1)+') td:eq(0)').children("select").val();
     // alert(projectid);
       $(this).children('td').each(function(j){ // 遍历 tr 的各个 td
         // alert("第"+(i+1)+"行,第"+(j+1)+"个td的值:"+$(this).text()+"。");
          var temp = $(this).children().val();
          var temp1 =temp;
          if(temp != null && temp !=""){
          temp = temp+"##,";
          t += temp ;
          }
          
          if(j == 2){
          normalTimeCount += (temp1*1);
          //alert("projectid="+projectid);
        // alert("temp1="+temp1);
          //typeof(tmp) == "undefined"
          if(typeof(temp1) != "undefined" &&  (temp1=='' || temp1 == null || temp1==0)){
          swal({
        title: "提示",
        text: "工时不能为空或0",
        type: "info"});
             $("#btnSave").button('reset');
             throw SyntaxError('工时不能为空或0');
          }
          }
          
       });
          normalTime +=t+"##;";
          console.log("normalTime="+normalTime);
    });


Logo

快速构建 Web 应用程序

更多推荐