datepicker没有在动态创建的html上工作

时间:2016-07-14 05:32:47

标签: jquery

我用输入创建动态div。 在jquery的帮助下。但问题是第一个日期选择器正在工作而另一个不是



$("#addholiday").on( "click", function() {
       var data = $('.holidayinput:last').attr('name').replace ( /[^\d.]/g, '' );
       var i = parseInt(data);
       var name = ++i;
        addRow(".add_holiday_div:last", ".add_holiday_div:last");
        $('.holidayinput:last').attr('name',name)
        $('#removeholiday').fadeIn();
    });

 $('.dpYears').datepicker({
        autoclose: true
    });
    [enter image description here][1]

 <div class="modal-body">
                    <div class="form-group add_holiday_div">
                        <label class="control-label col-xs-4">Select Holiday Date</label>
                        <div class="col-xs-7">
                            <div data-date-viewmode="years" data-date-format="mm-dd-yyyy" data-date="<?php echo  date("m-d-Y"); ?>"  class="input-append date dpYears">
                                <input type="text" readonly="" value="<?php echo  date("m-d-Y"); ?>" size="16" class="form-control holidayinput" name="holiday1" id="holiday1">
                                <span class="input-group-btn add-on">
                                    <button class="btn btn-danger" type="button"><i class="fa fa-calendar"></i></button>
                                </span>
                            </div>
                        </div>
                    </div>
                    <div class="panel">
                        <a href="#;" class="fa fa-plus pull-left" id="addholiday"> Add Holiday</a>
                        <a href="#;" class="fa fa-minus pull-right" id="removeholiday"> Remove Holiday</a>
                    </div>

                </div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

回忆datepicker函数中的click函数。

尝试使用如下所示:

$("#addholiday").on( "click", function() {
   var data = $('.holidayinput:last').attr('name').replace ( /[^\d.]/g, '' );
   var i = parseInt(data);
   var name = ++i;
    addRow(".add_holiday_div:last", ".add_holiday_div:last");
    $('.holidayinput:last').attr('name',name)
    $('#removeholiday').fadeIn();

    $('.dpYears').datepicker({
         autoclose: true
     });
});

 $('.dpYears').datepicker({
    autoclose: true
});
[enter image description here][1]