1

好吧,我是 javascript 和 jQuery 的菜鸟。我正在使用 jQuery UI 页面上的 .dialog 示例。我对标记进行了一些更改,结果我第一次提交时得到了“*idName*null”,但之后,它完成了我需要做的事情。似乎计数从 null 开始,然后增加 1、2、3,依此类推......下面是我正在使用的代码:

$(function () {
    var rowID = document.getElementById("RowPlaceholder"),
        fName = $("#fName"),
        lName = $("#lName"),
        jTitle = $("#jTitle"),
        cPhone = $("#cPhone"),
        oPhone = $("#oPhone"),
        eMail = $("#eMail"),
    allFields =  $([]).add(fName).add(lName).add(jTitle).add(cPhone).add(oPhone).add(eMail),
    tips = $(".validateTips");
    function updateTips(t) {
        tips
        .text(t)
        .addClass("ui-state-highlight");
        setTimeout(function () {
            tips.removeClass("ui-state-highlight", 1500);
        }, 500);
    }
    function checkLength(o, n, min, max) {
        if (o.val().length > max || o.val().length < min) {
            o.addClass("ui-state-error");
            updateTips("Length of " + n + " must be between " +
            min + " and " + max + ".");
            return false;
        } else {
            return true;
        }
    }
    $("#dialog-form").dialog({
        autoOpen: false,
        height: 470,
        width: 350,
        modal: true,
        buttons: {
            "Add Contact": function () {
                var bValid = true;
                allFields.removeClass("ui-state-error");
                bValid = bValid && checkLength(fName, "fName", 1, 16);
                bValid = bValid && checkLength(lName, "lName", 1, 16);
                bValid = bValid && checkLength(cPhone, "cPhone", 10, 16);
                bValid = bValid && checkLength(oPhone, "oPhone", 10, 16);
                bValid = bValid && checkLength(eMail, "eMail", 10, 80);
                if (bValid) {
                    $("#users tbody").append(
                    "<tr>" +
                    "<td id=\"fName" + rowID + "\">" + fName.val() + "</td>" +
                    "<td id=\"lName" + rowID + "\">" + lName.val() + "</td>" +
                    "<td id=\"jTitle" + rowID + "\">" + jTitle.val() + "</td>" +
                    "<td id=\"cPhone" + rowID + "\">" + cPhone.val() + "</td>" +
                    "<td id=\"oPhone" + rowID + "\">" + oPhone.val() + "</td>" +
                    "<td id=\"eMail" + rowID + "\">" + eMail.val() + "</td>" +
                    "</tr>")
                rowID++;
                    $(this).dialog("close");
                }
            },
            Cancel: function () {
                $(this).dialog("close");
            }
        },
        close: function () {
            allFields.val("").removeClass("ui-state-error");
        }
    });
    $("#create-user")
    .button()
    .click(function () {
        $("#dialog-form").dialog("open");
    });
});
4

2 回答 2

0

看看这里。在找不到 id 的情况下,getelementById 似乎返回 null。我的猜测是 RowPlaceholder 不存在并且返回 null。在 JavaScriptnull + 1中将返回 1,这就是它在第一个实例之后再次开始工作的原因。

于 2013-05-07T01:08:28.277 回答
0

我只是设置了一个 id 为 RowPlaceholder 的表单并将其设置为隐藏在 css 中。这成功了。感谢正确的方向

于 2013-05-19T22:23:40.737 回答