使用jquery-form-validator進行表單驗證

jquery-form-validator插件不驗證。我使用jQuery 1.9.0（該插件使用該版本進行測試）。使用jquery-form-validator進行表單驗證

HTML：

<form id="Form" method="get" action=""> 
     <div class="box-1"> 
      <label for="name">CONTACT NAME*<br /></label> 
      <label for="email">CONTACT EMAIL ADDRESS*<br /></label> 
     <label for="tel">CONTACT PHONE NUMBER</label> 
     </div> 

     <div class="box-2"> 
     <input id="name" name="name" type="text" /><br /> 
     <input id="email" name="email" type="text" /><br /> 
     <input id="tel" name="tel" type="tel"/><br /><br /> 
     <input class="submit" type="submit" value="SEND" /> 
    </div> 
    </form>

這裏我的頭標籤推杆的JavaScript（用腳本SRC給插件，當然jQuery的）：

的javascript：

<script> 
    $.validator.setDefaults({ 
       submitHandler: function() { alert("submitted!"); } 
      }); 
      $().ready(function() { 
       $("#Form").validate({ 
        rules: { 
         name: "required", 
         email: "required" 
        }, 
        messages: { 
         name: "Please enter your name", 
         email: "Please enter your email"; 
        } 
      }); 
    </script>

什麼是錯的？

來源

2014-01-13 Christian_g3k0

您是否正確導入了jQuery庫和驗證插件？ – zgood

肯定我下載了插件，並把aaaall插件文件放在服務器文件夾中... jquery導入正確導致我的幻燈片工作正常... –

變化來自：

$()

到

$(document)

你還需要改變你的rules：

rules: { 
    name: { required: true }, 
    email: { required: true } 
}

您還需要將所有代碼包裝在DOM準備好的內部。最終代碼應如下所示：

$(document).ready(function() { 
    $.validator.setDefaults({ 
     submitHandler: function() { alert("submitted!"); } 
    }); 

    $("#Form").validate({ 
     rules: { 
      name: { required: true }, 
      email: { required: true } 
     }, 
     messages: { 
      name: "Please enter your name", 
      email: "Please enter your email"; 
     } 

});

來源

2014-01-13 16:52:30 Felix

我試過了，但在這種情況下也不工作...我'我也嘗試把腳本放在表單結束標記後：（ –

你在控制檯中接收到任何javascript錯誤？ – zgood

只有一個警告：「event.returnValue已被棄用，請使用標準event.preventDefault（）「（在jquery 1.9.0.js 3307行） –

試試這個：

rules: { 
    name: { required: true }, 
    email: { required: true } 
},

來源

2014-01-13 16:52:22 ShaneBlake

使用jquery-form-validator進行表單驗證

回答

相關問題