为什么jquery跳过验证并显示成功？

Question

我有jquery，我正在使用验证，它跳过验证，它显示成功，但我没有输入任何值的文本字段，因为它必须是。任何人谁可以帮助请做。

这是我的jQuery。

<script src="http://code.jquery.com/jquery-latest.js"></script> 
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/zjquery.validate.js"> 
</script> 
<script type="text/javascript" src="js/jquery-1.2.6.min.js"></script> 
<script type="text/javascript" src="js/jquery-easing-1.3.pack.js"></script> 
<script type="text/javascript" src="js/jquery-easing-compatibility.1.2.pack.js"></script> 
<script type="text/javascript" src="js/coda-slider.1.1.1.pack.js"></script> 

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js"> 
</script> 

</script> 
<style type="text/css"> 
    label.valid { 
    color: green !important; // !important added 
    } 
    label.error { 
    float: none; 
    color: red; 
    padding-left: .5em; 
    vertical-align: top; 
    } 

</style> 

<script> 
    $(document).ready(function() { 
    $('#results').hide(); 
    $("#contactform").validate({ 
     debug: false, 
     rules: { 
     fname: "required", 
     subject: "required", 
     email: "required", 
     message: "required", 
     email: { 
      required: true, 
      email: true 
     } 
     }, 
     messages: { 
     Paymentfrequency: "Select frequency", 
     fname: "Type name ", 
     subject: "Type surname ", 
     email: "invalid email",  
     message: "Select loan type",     
     }, 
     submitHandler: function(form) { 
     $.post('mailmeform.php', $("#contactform").serialize(), function(data) { 
      $('#contactform').fadeOut("slow"); 
      $('#results').fadeIn(2000); 
     }); 
     } 
    }); 
    }); 
</script> 

下面

是HTML

<table name="contacttable" border="0" width="100%"> 
<form id="contactform" action="mailmeform.php" method = "post"> 
<table> 
    <tr><td><label>Name:</label></td><td><input type = "text" name = "fname"></td></tr> 
    <tr><td><label>Subject:</label></td><td><input type = "text" name = "subject"></td></tr> 
    <tr><td><label class="required">Email:</label></td><td><input type = "text" name = "email" ></td></tr> 
    <tr><td><label>message:</label></td><td><textarea cols = 40 rows=5 name = "message"></textarea></td></tr> 
    <tr><td><input type = "submit" value = "send"></td></tr> 
    </h3> 
</form><tr> 
<td><div id ="results"><p>Thanks We will be back to you soon</p></div></td> 
</tr> 
</div> 
</table> 

Answer 1

无效的HTML就是为什么验证被打破。不匹配的标签，未封闭的标签，在table内杂散</h3>和</div>标签，但关键的错误是如何包裹<form>标签你<table>周围...

<table name="contacttable" border="0" width="100%"> 
    <form id="contactform" action="mailmeform.php" method = "post"> 
     <table> 
      <tr>...</tr> 
      <tr>...</tr> 
    </h3> 
    </form> 
     <tr>...</tr> 
    </div> 
</table> 

一旦HTML被清理干净，但jQuery验证插件正常工作：

DEMO：http://jsfiddle.net/p2kLR/

---

而且，你包括插件两次。删除二审...

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js"> 

，并在其中的jQuery两次，删除旧版本...

<script type="text/javascript" src="js/jquery-1.2.6.min.js"></script> 

更多的东西是这样的：

<script src="http://code.jquery.com/jquery-latest.js"></script> 
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js"></script> 
<script type="text/javascript" src="js/jquery-easing-1.3.pack.js"></script> 
<script type="text/javascript" src="js/jquery-easing-compatibility.1.2.pack.js"></script> 
<script type="text/javascript" src="js/coda-slider.1.1.1.pack.js"></script> 

Answer 2

您使用jQuery验证插件Jquery Validate

只是尝试在演示添加类，如：

class="required" 
class="required email" 

您加入jQuery验证scripst两次。删除一个：按钮

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js"> 

Answer 3

试形式验证单击

$('#submit').click(function(){ 

//your code 

and if true 
$('#results').show(); 
}); 

和

$(document).ready(function(){ 
    $('#results').hide(); 
});