最近用做的公司内部管理系统的工时管理,需求是要在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);
});