Question

在我的项目中，我有一个用于meetdate的文本框，我已将id = meetingdate1给予此文本框。如果想要添加更多会议日期，那么就有按钮。单击此按钮后，新文本框添加到上一个文本框下面，比如meetdate2，meetingdate3等等......现在我想添加datepicker文本框而不是文本框，所以我已经使用了jquery来实现这个目的。它的第一个文本框的工作，其id = meetingdate1但是datepicker功能没有进入id = meetingdate2，id = meetingdate3等其他文本框......

jquery代码是：

        $("#addButton").live("click", function () {

        if(counter_ldates>10){
            alert("Only 10 dates allowed");
            return false;
        }   

        var newTextBoxDiv = $(document.createElement('div')).attr("id", 'LdateDiv' + counter_ldates);
            newTextBoxDiv.html('<label>Date #'+ counter_ldates + ' : </label>' +
            '<input type="text" name="meetingdate' + counter_ldates + 
            '" id="meetingdate' + counter_ldates +
            '" class="ldatestextbox" value="" style="width: 75px" >');

        newTextBoxDiv.appendTo("#LdatesGroup");

        counter_ldates++;
        $('#ldates_cnt').attr('value', counter_ldates);
    });
    $( "#meetingdate1" ).datepicker();
$( "#meetingdate2" ).datepicker();
$( "#meetingdate3" ).datepicker();
$( "#meetingdate4" ).datepicker();
$( "#meetingdate5" ).datepicker();

如何解决这个datepicker问题？

Answer 1

尝试在添加新输入后初始化datepicker：

newTextBoxDiv.appendTo("#LdatesGroup").find("input").datepicker();

您正在做的是，尝试初始化元素上的日期选择器（尚未）。

Answer 2

尝试这个，我相信会有效。

newTextBoxDiv.appendTo("#LdatesGroup");
$('#meetingdate' + counter_ldates).datepicker();
counter_ldates++;

动态添加文本框时的Datepicker问题

2 个答案: