jQuery表單驗證不驗證

我只是在這裏讓自己瘋狂。我無法弄清楚爲什麼我的jQuery驗證不起作用。該功能甚至沒有在Dreamweaver中彈出，就像無法找到它。我把這個代碼從jQuery網站上取下來了。有人請幫忙！jQuery表單驗證不驗證

這是我的HTML代碼：

<!doctype html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title>Logic & Design: Home</title> 
     <link rel="stylesheet" type="text/css" href="styles/divs.css" /> 
     <link rel="stylesheet" type="text/css" href="styles/fonts.css" /> 
     <link rel="stylesheet" type="text/css" href="styles/forms.css" /> 
     <link rel="stylesheet" type="text/css" href="styles/tags.css" /> 
     <link rel="stylesheet" type="text/css" href="styles/images.css" /> 
     <script src="http://code.jquery.com/jquery-latest.js"></script> 
     <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script> 
     <script src="scripts/animations.js"></script> 
     <script src="scripts/socialMediaPlugins.js"></script>   
     <script src="scripts/formValidate.js"></script> 
    </head> 
    <body> 
     <div id="wrapper"> 
      <header> 
       <img id="logo" alt="logo" src="images/Logo.png" /> 
      </header> 
      <div id="divider"> 
       <img id="headerDivider" alt="Line" src="images/Line.jpg" /> 
      </div> 
      <nav> 
       <div class="Button" id="selectedButton"> 
        <img id="arrowOverlay" alt="Overlay" src="images/Arrows/FadeArrow.png" /> 
        <img id="extender" alt="Home" src="Images/Arrows/Arrow%20Body.png" /> 
        <img id="selectedArrow" alt="Contact Me" src="Images/Arrows/Contact/Contact.png"/> 
       </div> 
       <div class="Button" id="homeButton"> 
        <img alt="Home" src="Images/Arrows/Home/Home.png" /> 
       </div> 
       <div class="Button" id="aboutButton"> 
        <img alt="About Me" src="Images/Arrows/About/About.png"/> 
       </div> 
       <div class="Button" id="abilitiesButton"> 
        <img alt="My Abilities" src="Images/Arrows/Abilities/Abilities.png"/> 
       </div> 
       <div class="Button" id="portfolioButton"> 
        <img alt="My Portfolio" src="Images/Arrows/Portfolio/Portfolio.png"/> 
       </div> 
      </nav> 
      <div id="mainContent"> 
       <div id="innerContent"> 
        <form id="emailForm" name="Email" method="post" action=""> 
         <div class="FormRow"><label for="Name">Name</label><input name="Name" type="text" /></div> 
         <div class="FormRow"><label for="Email">Email Address</label><input name="Email" type="text" /></div> 
         <div class="FormRow"><textarea name="Message"></textarea></div> 
         <div class="FormRow"><input type="submit" name="Submit" value="Message Me!" /></div> 
        </form> 
        <div id="results"></div> 
       </div> 
      </div> 
      <div id="imageBar"> 
       <div id="networkingIcons"> 
        <div id="fb" class="fb-like-box" data-href="http://www.facebook.com/logicanddesign" data-width="200" data-height="75" data-colorscheme="dark" data-show-faces="false" data-stream="false" data-header="false"></div> 
        <a class="twitter-timeline" href="https://twitter.com/JackSchaible" data-widget-id="266804071627898880">Tweets by @JackSchaible</a> 
        <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script> 
        <div class="g-plus" data-width="199" data-height="69" data-href="https://plus.google.com/105579960548041650339" data-rel="author" data-theme="dark"></div> 
        <script type="text/javascript"> 
         (function() { 
         var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; 
         po.src = 'https://apis.google.com/js/plusone.js'; 
         var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); 
         })(); 
        </script> 
        <script src="//platform.linkedin.com/in.js" type="text/javascript"></script> 
<script type="IN/Share" data-counter="right"></script> 
       </div> 
      </div> 
      <footer> 
       <p>&copy; <script type="text/javascript">document.write((new Date).getFullYear());</script> Jack Schaible</p> 
      </footer> 
     </div> 
     <?php 
      /*if ($errors != '') { 
       echo '<script type="text/javascript">'; 
        echo 'alert($errors);'; 
       echo '</script>'; 
      }*/ 
     ?> 
    </body> 
</html>

這是我formValidate.js：

// JavaScript Document 
$(document).ready(function(){ 
    $("#emailForm").validate(); 
});

來源

2012-11-11 Jack

您的驗證規則在哪裏？ – Gihan

我認爲你缺少驗證規則。

  <form id="emailForm" name="Email" method="post" action=""> 
       <div class="FormRow"><label for="Name">Name</label><input name="Name" type="text" class="required" /></div> 
       <div class="FormRow"><label for="Email">Email Address</label><input name="Email" type="text" class="required email" /></div> 
       <div class="FormRow"><textarea name="Message"></textarea></div> 
       <div class="FormRow"><input type="submit" name="Submit" value="Message Me!" /></div> 
      </form>

應該像上面那樣。在表單元素的類屬性中添加您的驗證規則。

來源

2012-11-11 05:20:27 Gihan

謝謝，我是jQuery表單驗證的新手......沒有在該示例中看到該部分。 – Jack

你檢查，看看是否形式是有效的？像這樣？

if ($("emailForm").valid() === true) { ... } else { return; }

來源

2012-11-11 05:16:45 DevlshOne

jQuery表單驗證不驗證

回答

相關問題