如何对具有相同Id的不同元素使用datetimepicker()

时间:2017-10-24 12:25:03

标签: javascript jquery html datetimepicker bootstrap-datetimepicker

在我的代码中,将使用jQuery动态生成某个 div 元素。所以我使用.html()获取了 div 元素的副本并附加了它。现在,在 div 中,我有一个日期字段,我必须使用 datetimepicker()。现在我发现 datetimepicker 不适用于具有相同ID的不同元素。

这是一个演示片段。

<!--testing-->
        <div id='testdate'>
            <div class='input-group date' id='recoverydate2'>
                <input type='text' class="form-control" placeholder="Select year" id="rcv_date" name="year" value="<?php echo $gde_date;?>" />
                <span class="input-group-addon">
                   <span class="glyphicon glyphicon-calendar"></span>
                </span>
            </div>
            <!-- <div class='input-group date' id='recoverydate2'>
                <input type='text' class="form-control" placeholder="Select year" id="rcv_date" name="year" value="<?php echo $gde_date;?>" />
                <span class="input-group-addon">
                   <span class="glyphicon glyphicon-calendar"></span>
                </span>
            </div> -->
        </div>
 <!--testing-->

第二个评论 div 元素会动态生成。所以我必须让 datetimepicker()为他们两个工作。

这是JS

$(#recoverydate2').datetimepicker({
    format: 'DD-MM-YYYY'
});

虽然我试过这个让它们都起作用但是没有用。

$('#testdate #recoverydate2:eq(0)').datetimepicker({
    format: 'DD-MM-YYYY'
});
$('#testdate #recoverydate2:eq(1)').datetimepicker({
    format: 'DD-MM-YYYY'
});

1 个答案:

答案 0 :(得分:1)

具有相同ID的多个元素无效HTML。这就是class存在的原因!也就是说,您可以使用新ID创建div的副本。

例如:

$('#testdate').append(
  '<div class="input-group date" id="recoverydate2-generated">' +
  $('#recoverydate2').html() +
  '</div>'
);

我希望这有帮助!