Question

我使用jquery的clone（）方法在表中动态生成输入字段的代码。代码如下

$(document).ready(function(){
    $("#myTable tr:last input").live("click",function(){
    $(this).parent().parent().clone().appendTo("#myTable");
    });

    });

我的表格的html代码如下

<table id="myTable" class="timingtable" border="1" cellpadding="0" cellspacing="0" align="left" style="width:100%; height:170px;">
  <tr>
    <th>Start time</th>
    <th>End time</th>
    <th>Family</th>
  </tr>
  <tr>
    <td><input type="date" name="start" id="element1" class="datefield" value=""></td>
    <td><input type="date" name="end" id="element2" class="datefield" value="" ></td>
    <td><input type="text"/></td>
  </tr>
  <tr>
   <td><input type="date" name="start" id="element3" class="datefield" value=""></td>
    <td><input type="date" name="end" id="element4" class="datefield" value="" ></td>
    <td><input type="text"/></td>
  </tr>
<tr>
    <td><input type="date" name="start" id="element5" class="datefield" value=""></td>
    <td><input type="date" name="end" id="element6" class="datefield" value="" ></td>
    <td><input type="text"/></td>
  </tr>
<tr>
    <td><input type="date" name="start" id="element7" class="datefield" value=""></td>
    <td><input type="date" name="end" id="element8" class="datefield" value="" ></td>
    <td><input type="text"/></td>
  </tr>
<tr>
   <td><input type="date" name="start" id="element9" class="datefield" value=""></td>
    <td><input type="date" name="end" id="element10" class="datefield" value="" ></td>
    <td><input type="text"/></td>
  </tr>
<tr>
   <td><input type="date" name="start" id="element11" class="datefield" value=""  /></td>
    <td><input type="date" name="start" id="element12" class="datefield" value=""/></td>
    <td><input type="text"/></td>
  </tr>
</table>

我已将timepicker添加到输入字段，如下所示

<script type="text/javascript">
        $(function () {
            $('.datefield').timepicker();
        });

datefield是给静态输入字段的类名。

我正在获取静态字段的时间戳，但我没有为动态生成的输入字段获取时间戳。

我还需要做些什么来为动态生成的字段获取timepicker。请为此问题提供解决方案。

提前感谢.......

Answer 1

您必须手动更改timepicker字段的ID。然后将timepicker应用于动态添加的字段。只有这样才行。因为timepicker使用元素的ID。

另外

$(document).ready(function(){
    $("#tableID tr:last input").live("click",function(){
    $(this).parent().parent().clone().appendTo("#tableID");
    });

    });

而不是这个使用此

$(document).ready(function(){
    $("#tableID tr:last input").live("click",function(){
    $(this).closest('tr').clone().appendTo("#tableID");
    });

    });

Answer 2

只有一个人怀疑为什么你需要id和class？

我有类似的要求，我只对班级做了...因为id迎合了唯一性。

检查以下链接：

http://jsfiddle.net/manmohan_menon/6YkyY/4/

使用jquery添加jquery timepicker以动态添加表中的输入字段

2 个答案: