Question

我不知道如何解释我正在尝试做什么，所以这里是我的代码的简短版本：

var counter = 1;
    var currDate = new Date(),
    today = (currDate.getMonth() + 1) + '/' + currDate.getDate() + '/' + currDate.getFullYear();
    $("#btnAdd").click(function (event) {
        addRow = "<tr><td><input type='text' class='dateClass defaultDate' id='txtDate" + counter + "'/></td></tr>";
        event.preventDefault();
        counter++;
        $("#tblName").append(addRow);
        $("#txtDate" + counter).val(today);
        $(".dateClass").datepicker();
    });

动态添加的行包含用户将选择的日期的文本框，但默认情况下，此值的值将是当前日期。现在，我的问题是，每当我点击添加行按钮时，前一个文本框的值将恢复为默认日期，即使我已经为它设置了不同的日期。

我知道它，因为每个添加的行都有类名defaultDate所以我想我必须使用id而不是txtDate + counter（即txtDate2），但是我不确定是不是做法。所以基本上，如何告诉按钮，当它添加一个新行时，它只会将默认日期设置为新行，而不应该更改上一行的当前值？

Answer 1

你正在以奇怪的顺序做事

使用计数器
增量计数器
再次使用计数器

问题在于，在上面它已经增加了。只需移动这一行：

counter++

到这一行之后：

$("#txtDate" + counter).val(today);

实例：http://jsfiddle.net/Nmk39/

Answer 2

尝试定义计数器

var counter = 1;

中的所有函数，否则它不是全局变量，而且，它会在每个按钮中重置，单击为值1，所有按钮都具有相同的ID。

然后，需要通过引用id来分配值：

$("#txtDate" + counter).val(today);

否则重置所有类的输入。

Answer 3

试试这个

   var counter = 1;
        var currDate = new Date(),
        today = (currDate.getMonth() + 1) + '/' + currDate.getDate() + '/' + currDate.getFullYear();
        $("#btnAdd").click(function (event) {
            addRow = "<tr><td><input type='text' class='dateClass defaultDate' value='"+today+"'id='txtDate" + counter + "'/></td></tr>";
            event.preventDefault();
            counter++;
            $("body").append(addRow);
            $(".dateClass").datepicker();
        });

将默认值添加到动态添加的行

3 个答案: