Question

您好我在我的页面中创建了一个表格，其中我使用了timepicker功能作为输入元素，并使用下面的函数，每当我到达表格的最后一行时，我在表格中添加一个新行：

<script type="text/javascript">
    $(document).ready(function(){
    $("#myTable tr:last input").live("click",function(){
    $(this).parent().parent().clone().appendTo("#myTable");
    }); 
    }); 
   </script>

这很好用，我在表格中添加了jquery timepicker：

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/darkness/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<link href="../css/jquery.ui.timepicker.css" rel="stylesheet" />
<script src="../js/jquery.ui.timepicker.js"></script>
  <script>
  jQuery(function($){
    $('#element1').timepicker();
    $('#element2').timepicker();
    $('#element3').timepicker();
    $('#element4').timepicker();
});

我页面中的表格如下：

<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="text" name="start" id="element1" value=""></td>
    <td><input type="text" name="end" id="element2" value="" ></td>
    <td><input type="text"/></td>
  </tr>
  <tr>
   <td><input type="text" name="start" id="element3" value=""></td>
    <td><input type="text" name="end" id="element4" value="" ></td>
    <td><input type="text"/></td>
  </tr>
</table>

这里我需要动态地将Jquery Timepicker功能添加到我表中新添加的行中，我该怎么做？非常感谢任何帮助....提前感谢....

Answer 1

将字段设置为“datefield”类（或者甚至更好，开始使用输入类型“date”），然后执行：

$(document).on("load", ".datefield", function(e){
    $(this).timepicker();
});

将jquery时间选择器添加到表中动态添加的行

1 个答案: