我遇到了jquery验证问题。我在我的网站上以多种不同的形式使用它。对于所有表单 - 行为按照广告的方式工作,但是,在其中一个表单中,当我单击提交时 - 只有第一个字段显示消息“此字段是必需的”而不是所有显示它的消息。只有在单击提交并查看第一个验证消息之后,然后在其他一些字段中随机点击一下,才能显示剩余的验证消息。据我了解,这不是默认行为。如果需要3个字段且没有填写 - 提交操作应突出显示具有相同消息的所有3个字段吗?
这是js:
$(document).ready(function() {
$("#form").validate({ errorElement: "div" });
});
function sendComments() {
if ($("#form").valid()) {
// something
}
}
这是标记:
<form id="form" runat="server">
<div id="divContact">
<table cellpadding="5" cellspacing="5">
<tr>
<td>
<a class="title">Name:</a>
<input type="text" id="txtName" class="required" runat="server" />
</td>
</tr>
<tr>
<td>
<a class="title">Email:</a>
<input type="text" id="txtEmail" class="required email" runat="server" />
</td>
</tr>
<tr>
<td>
<a class="title">Comments:</a>
<textarea id="txtComments" cols="40" rows="6" class="required"></textarea>
</td>
</tr>
<tr>
<td>
<br />
<a id="btnSend" class="roundButton" onclick="return sendComments()">Send</a>
</td>
</tr>
</table>
</div>
</form>
这是样式表:
#divContact
{
margin-top: 50px;
text-align:center;
}
#divContact a.title
{
display:block;
color:White;
font-family:Verdana;
font-size:0.8em;
}
#txtComments, #txtEmail
{
width:100%;
}
#divContact table
{
text-align:left;
padding: 20px;
background-color:#3F0F54;
width:350px;
margin: 10px auto 0 auto;
border: 3px double grey;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
}
div.error
{
display:block;
color:Red;
font-size: 0.7em;
font-family: Verdana, Tahoma, Arial, "Helvetica Neue", Helvetica, Sans-Serif;
}
答案 0 :(得分:3)
我已经弄明白了 - 在标记中我忘了给每个输入字段一个名称属性。将此添加到每个元素已使验证正常工作!