好吧,我是 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");
});
});