我有一个包含此字段的表单,通过“添加”按钮我可以添加行:book_date[]、book_desc[]、book_pages[]。

<form method="POST" action="addpages.php" name="books" onmouseover="javascript:sum();"> 
 
    <button type="button" onClick="addRow('dataTable')">  ADD Book </button> 
        <table id="dataTable" class="form"> 
            <input type="text" class="form-control" name="date_book[]"> 
            <input type="text" class="form-control" name="book_pages[]"> 
            <input type="text" class="form-control" name="book_pages_total"> 
        </table> 
    </form> 

添加新行时,我希望将第一个字段 date_book 内的值复制到新行中。

我尝试使用此启动脚本,但这不适用于新行。

var $date_book= $("#date_book[]"); 
 
$date_book.on("keydown",function(){ 
   setTimeout(checkValue,0);  
}); 
 
var v2 = $date_book[].val(); 
var checkValue = function(){ 
    var v1 = $field1.val(); 
    if (v1 != v2){ 
        $date_book[].val(v1); 
        v2 = v1; 
    } 
}; 

如何复制每个新行中写入的 date_book[] 中的日期值?

我希望能解释我的问题。

谢谢

请您参考如下方法:

您应该从有效的 HTML 开始,输入不能是表格的子项。我刚刚根据名称模拟了一些东西。

修复此问题后,在 POJS 中您可以克隆最后一行并将其添加到表中。这也将克隆表单控件当时恰好具有的任何值,因此,如果您只想保留第一个值,则执行此操作并清除其他值,例如

function addRow(tableId) { 
  var table = document.querySelector('#' + tableId); 
  var lastRow = table.rows[table.rows.length - 1]; 
 
  // Create a new row by cloning the last one 
  var newRow = lastRow.cloneNode(true); 
  var inputs = newRow.querySelectorAll('input'); 
 
  // Clear all but first input 
  [].forEach.call(inputs, (input, i) => {if (i) input.value = '';});  
 
  // Add the row to the table 
  lastRow.parentNode.appendChild(newRow); 
}
<form name="books"> 
  <button type="button" onClick="addRow('dataTable')">  ADD Book </button> 
  <table id="dataTable" class="form"> 
    <tr> 
      <td>Date:  
      <td><input type="text" class="form-control" name="date_book[]"> 
      <td>Pages: 
      <td><input type="text" class="form-control" name="book_pages[]"> 
      <td>Pages total: 
      <td><input type="text" class="form-control" name="book_pages_total"> 
  </table> 
</form>


评论关闭
IT虾米网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!