我一直在使用一些简单的表单验证工作，并使用javascript函数和ajax提交。我编写了一个函数来验证表单，然后将其提交到另一个php页面。然后我创建了第二个表单并验证/提交了javascript函数。两者都是分开工作的，所以我不认为我的函数是错误的，但是当我尝试将它们放入一个js文件来调用它们时，只有一个函数可以工作。我可以删除其他重新上传它，它调用很好。如果有人能发现我做错了什么，我将不胜感激。
$(function () {
$('.error').hide();
});
function publication(){
$('.error').hide();
var title = $("input#title").val();
if (title == "") {
$("label#title_error").show();
$("label#title_error").css("color", "red");
$("input#title").focus();
return false;
}
var author = $("input#author").val();
if (author == "") {
$("label#author_error").show();
$("label#author_error").css("color", "red");
$("input#author").focus();
return false;
}
var publisher = $("input#publisher").val();
if (publisher == "") {
$("label#publisher_error").show();
$("label#publisher_error").css("color", "red");
$("input#publisher").focus();
return false;
}
var avail = $("input#avail").val();
if (avail == "") {
$("label#avail_error").show();
$("label#avail_error").css("color", "red");
$("input#avail").focus();
return false;
}
var info = $("textarea#info").val();
if (info == "") {
$("label#info_error").show();
$("label#info_error").css("color", "red");
$("textarea#info").focus();
return false;
}
var webaddr = $("input#webaddr").val();
var YYYY = $("input#YYYY").val();
var img = $("input#img").val();
var dataString = 'title='+ title + '&author=' + author + '&publisher=' + publisher + '&avail=' + avail + '&info=' + info + '&YYYY=' + YYYY + '&webaddr=' + webaddr + '&img=' + img;
//alert (dataString);return false;
$.ajax({
type: "POST",
url: "/includes/add_publication.php",
data: dataString,
success: function() {
$('#event_form').html("<div id='message'></div>");
$('#message').html("<h2>Publication Added</h2>")
.append("<p>The publication has been added to the database.</p>")
.hide()
.fadeIn(1500);
}
});
return false;
}
function events(){
$('.error').hide();
var eventname = $("input#eventname").val();
if (eventname == "") {
$("label#event_error").show();
$("label#event_error").css("color", "red");
$("input#eventname").focus();
return false;
}
var venue = $("input#venue").val();
if (venue == "") {
$("label#venue_error").show();
$("label#venue_error").css("color", "red");
$("input#venue").focus();
return false;
}
var info = $("textarea#info").val();
if (info == "") {
$("label#info_error").show();
$("label#info_error").css("color", "red");
$("textarea#info").focus();
return false;
}
var webaddr = $("input#webaddr").val();
var DD = $("input#DD").val();
var MM = $("input#MM").val();
var YYYY = $("input#YYYY").val();
var DD2 = $("input#DD2").val();
var MM2 = $("input#MM2").val();
var YYYY2 = $("input#YYYY2").val();
var img = $("input#img").val();
var dataString = 'eventname='+ eventname + '&venue=' + venue + '&info=' + info + '&webaddr=' + webaddr + '&DD=' + DD + '&MM=' + MM + '&YYYY=' + YYYY + '&DD2=' + DD2 + '&MM2=' + MM2 + '&YYYY2=' + YYYY2 + '&img=' + img;
//alert (eventString);return false;
$.ajax({
type: "POST",
url: "/includes/add_event.php",
data: dataString,
success: function() {
$('#event_form').html("<div id='message'></div>");
$('#message').html("<h2>Event Added</h2>")
.append("<p>The event has been added to the database.</p>")
.hide()
.fadeIn(1500);
}
});
return false;
}
publication和events函数通过HTML中的click处理程序调用（此处为publication）：
<table width="100%" id="publication">
<tr>
<td width="20%">Title:</td>
<td>
<input name="title" type="text" id="title" size="50" />
</td>
<td width="30%">
<label class="error" for="title" id="title_error">This field is required.</label>
</td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td>Author:</td>
<td>
<input name="author" type="text" id="author" size="50" />
</td>
<td>
<label class="error" for="author" id="author_error">This field is required.</label>
</td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td>Publisher:</td>
<td>
<input name="publisher" type="text" id="publisher" size="50" />
</td>
<td>
<label class="error" for="publisher" id="publisher_error">This field is required.</label>
</td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td>Publication Year:</td>
<td>
<input name="YYYY" type="text" id="YYYY" size="4" />
</td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td>Website:</td>
<td>http://
<input name="webaddr" type="text" id="webaddr" size="50" />
</td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td>Availability:</td>
<td>
<input name="avail" type="text" id="avail" size="30" />
</td>
<td>
<label class="error" for="avail" id="avail_error">This field is required.</label>
</td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td valign="top">Publication Information:</td>
<td>
<textarea rows="4" cols="50" name="info" id="info"></textarea>
</td>
<td>
<label class="error" for="info" id="info_error">This field is required.</label>
</td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td>Image Name:</td>
<td>
<input name="img" type="text" id="img" size="50" />
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" name="submit" class="button" id="pubs_btn" value="Add" onclick="publication()" />
</td>
</tr>
</table>
正如你可以看到的，这里发生了三件事。 1：所有错误消息都隐藏在页面加载上，第二个和第三个是我的两个函数 - 发布和事件。我有几个已验证的字段，如果它们为空，则会收到rec错误消息。然后我将所有变量发送到一个字符串，通过ajax提交到php文件，将它们插入到我的sql数据库中。
我可能会遗漏一些像分号一样简单的东西 - 但由于我从未在一个文件中写过多个函数，所以我还没有解决这个问题。
答案 0 :(得分：1)
您遇到语法错误：
var eventString = 'eventname='+ eventname + '&venue=' + venue + '&info=' + info '&webaddr' + webaddr + '&DD' + DD + '&MM' + MM + '&YYYY' + YYYY + '&DD2' + DD2 + '&MM2' + MM2 + '&YYYY2' + YYYY2 + '&img' + img;
// Here ------------------------------------------------------------------------^
这可以防止您的JavaScript被正确解析，从而阻止您的代码在点击发生时运行。
您的网络浏览器告诉您：如果您打开网络控制台或开发者工具，您会看到列出的错误。