Question

我有一个表单，最初从jquery-ui加载一个日期选择器。然后，用户可以单击“添加”以添加更多日期。这些新的日期字段应附加到DOM，但显然不会。我知道我需要或者应该使用.live（）或.bind（），但我在最好的方法上遇到了一些麻烦。以下是我的代码。谢谢你的任何想法。

        // add a formfield
    function addFormField() {
        var id = document.getElementById("DateID").value;                       

        // add date form to page
        $("td#dateDiv").append("<p id='row" + id + "'> Calendar Dates " + id + " <br> <input type='text' size='20' class='hasDatepicker' name='inputDate[]' id='inputDate" + id + "'>&nbsp;&nbsp<a href='#' onClick='removeFormField(\"#row" + id + "\"); return false;'>Remove</a><p>");

        $('#row' + id).highlightFade({
            speed:1000
        });

        id=(id-1) + 2;
        document.getElementById("DateID").value = id;
    }

    function removeFormField(id) {
        $(id).remove();
    }       

    $("#addDate").live("click", function(){
          addFormField();
    });

Answer 1

首先确保你的addFormField函数实际上是将新字段插入到表单中。然后在任何新字段上调用.datepicker();。

在addFormField内部：

$("td#dateDiv").append(...

$("td#dateDiv").find(".hasDatepicker").datepicker();

动态添加多个jquery ui datepickers到页面

1 个答案: