在创建的表行中使用Bootstrap Datepicker

我正在为项目创建数据夹点，我需要使用Bootstrap Datepicker到Date字段。 问题是在表中只有第一行（以前创建的）有datepicker工作。 如果我创建第二行，则datepicker不起作用。

请你帮助我好吗？ 我想让datepicker在每个创建的行中正常工作，并且只在Date字段上工作。

以下是我的代码：

function getElementsByClassName(c,el){ if(typeof el=='string'){ el=document.getElementById(el); } if(!el){ el=document; } if(el.getElementsByClassName){ return el.getElementsByClassName(c); } var arr=[], allEls=el.getElementsByTagName('*'); for(var i=0;i-1){arr.push(allEls[i])} } return arr; } function killMe(el){ return el.parentNode.removeChild(el); } function getParentByTagName(el,tag){ tag=tag.toLowerCase(); while(el.nodeName.toLowerCase()!=tag){ el=el.parentNode; } return el; } // Delete table row function delRow(){ killMe(getParentByTagName(this,'tr')); } // Insert table row function addRow() { var table = getParentByTagName(this,'table') var lastInputs=table.rows.length>2? table.rows[table.rows.length-2].getElementsByTagName('input'):[]; for(var i=0;i<lastInputs.length-1;i++){ if(lastInputs[i].value==''){return false;} } // New table row vars var rowCount = table.rows.length; var row = table.insertRow(rowCount-1); var cell1 = row.insertCell(0); var element1 = document.createElement("input"); element1.id = "expenseDate"; element1.type = "text"; element1.className="form-control datepicker"; cell1.appendChild(element1); var cell2 = row.insertCell(1); var element2 = document.createElement("input"); element2.type = "text"; element2.className="form-control"; cell2.appendChild(element2); var cell3 = row.insertCell(2); var element3 = document.createElement("input"); element3.type = "text"; element3.className="form-control"; cell3.appendChild(element3); var cell4 = row.insertCell(3); var element4 = document.createElement("input"); element4.type = "text"; element4.className="form-control"; cell4.appendChild(element4); var cell5 = row.insertCell(4); var element5 = document.createElement("input"); element5.type = "button"; element5.className="del btn btn-sm btn-danger"; element5.value='X'; element5.onclick=delRow; cell5.appendChild(element5); } 

 #ExpensesTable { margin-top: 30px; } #ExpensesTable tr { margin: 10px 0px 10px 0px; } #ExpensesTable td { padding: 5px 5px 0px 5px; } #ExpensesTable th { padding: 0px 5px 5px 5px; } 

         
 
 
 
Date:
 
From:
 
To:
 
Nr. Km:
 
 
 
 
 
 
      (function(){ var els=getElementsByClassName("add","ExpensesTable"); for(var i=0;i<els.length;i++){ els[i].onclick=addRow; } els[0].onclick(); })();   $('#expenseDate').datepicker({ });    

Answer 1

尝试利用jquery加速编码，然后你最终得到类似的4-5行代码来做你需要的:)

干杯，

 $('.dateP').datetimepicker(); $('.dupli').on( 'click', function(e){ var dup = $('.cpy').first().clone(); $('.table').append( dup ); $('.dateP').datetimepicker(); }); 

       
 
 
Event name
 
Date:
 
+