Javascript - 在每个新行中复制日期/时间

时间:2017-01-21 00:11:54

标签: javascript

我有一个带有此文件的表单,通过ADD按钮我可以添加行: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 []中写入的日期值?

我希望解释我的问题。

由于

1 个答案:

答案 0 :(得分:1)

您应该从有效的HTML开始,输入不能成为表的子项。我只是根据名字嘲笑了一些东西。

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

&#13;
&#13;
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);
}
&#13;
<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>
&#13;
&#13;
&#13;