0

我正在阅读有关表单验证的教程，并遵循了它。表格仍未验证。请帮帮我。谢谢

<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="stylesheet.css" type="text/css" rel="stylesheet">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>    
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
<script>
$(document).ready(function(){
    $("#registerForm").validate();
  });
</script>

<title>9am Resource Agency</title>
</head>

这是表格，

 <form id="form1" class="registerForm" method="post" action="mailsent.php">                                                
                      <input name="name" class="required" type="text" minlength="3"  id="name"  style="font-family: Verdana; color:#FFFFFF; ; font-size: 13px; background-color: #0E0E0F;border: 1px solid #740086; margin-bottom:10px;  width:385px;" size="32" value="Name" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/>                  
                      <input name="email" class="required" type="text" id="email" minlength="5"  style=" font-family: Verdana;  font-size: 13px;  color:#FFFFFF; background-color: #0E0E0F; border: 1px solid #740086;  margin-bottom:10px;   width:385px;" size="38" value="Email" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" />
                      <input name="phone"  type="text" id="phone" minlength="7" style=" font-family: Verdana; color:#FFFFFF; font-size: 13px;background-color: #0E0E0F; border: 1px solid #740086; width:385px;  margin-bottom:10px;" size="385" value="Phone #" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/>
                     <textarea
                     minlength="10"
                     class="required"
    name="message"
    cols="37"
    rows="12"
    id="message"
    style="font-family:Verdana; color:#FFFFFF; font-size:13px; background-color:#0E0E0F; border:1px solid #740086; width:385px;margin-bottom:10px;overflow:hidden;"
    onFocus="if(this.value==this.defaultValue)this.value='';"
    onBlur="if(this.value=='')this.value=this.defaultValue;">
Message
</textarea>

                      <input style="margin-left:303px; margin-top:20px;" type="image" src="logonbutton.png" name="Submit" value="Submit" />                    
   </form>
4

4 回答 4

3

您正在使用$("#registerForm").validate();，但您的表单 ID 是form1. 改成：

$("#form1").validate();
于 2012-06-09T11:54:19.400 回答
2

工作演示 http://jsfiddle.net/dMTCq/

好的链接：http ://docs.jquery.com/Plugins/Validation/validate

从我之前的演示中还可以为您提供一些额外的东西：http: //jsfiddle.net/CRfuZ/

这应该有帮助:)

代码

jQuery(function($) {
    $("#form1").validate();
});

*如果你想用于课堂使用 * .像这样。

jQuery(function($) {
    $(".registerForm").validate();
});
于 2012-06-09T11:54:52.863 回答
2

无需在头部包含两个 jquery-core 文件。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
于 2012-06-09T11:56:58.977 回答
1

我很好奇为什么你的脚本标签中有 2 个版本的 jQuery。版本 1.6.1 和版本 1.3.2

如果您想执行 jQuery 验证，您也没有包括 jQuery 不显眼的验证。

我建议删除版本 1.3.2 行，因为它与 1.6.1 冲突，然后添加必要的脚本进行验证。按此顺序：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>

如果你想要最新版本的 jQuery，我建议不要使用 1.6.1 脚本，而是使用这个。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>

可以将这 4 行放在您的_Layout视图中的head部分中，以便它们可用于所有视图。然后您根本不必将它们放在您的个人视图中

于 2012-06-09T12:00:20.300 回答