我一直在嘗試使用jQuery validation plugin驗證移動表單,但沒有取得太大的成功。jQuery Mobile驗證插件
看起來好像我訪問的第一個頁面有一個表單確認ok。 後續頁面不驗證,除非它們具有與第一頁上的驗證相同的字段。
例如,我訪問的第一頁是登錄頁面。它有2個字段,電子郵件地址和密碼。
的代碼是:
<body>
<div id="Login" data-role="page">
<script type="text/javascript">
$(document).on('pageinit pageshow', 'div:jqmData(role="page"), div:jqmData(role="dialog")', function(){
if($("form.validate").length > 0){
$("form.validate").validate({
rules: {
email_address: {
required: true,
email: true
},
password: "required"
}
});
}
});
</script>
<form name="login" method="post" class="validate">
<label class="inputLabel" for="login-email-address">Email Address:</label>
<input type="email" name="email_address" size="18" id="login-email-address" />
<label class="inputLabel" for="login-password">Password:</label>
<input type="password" name="password" size="18" id="login-password" />
<input type="submit" value="Log In" data-icon="lock" data-mini="true" alt="Log In" title=" Log In " />
</form>
</div>
</body>
這證實當我點擊提交按鈕。 如果我從登錄頁面點擊按鈕進入創建帳戶頁面,其中有4個字段 - 名字,姓氏,電子郵件地址&密碼只有電子郵件地址和密碼驗證。
的創建賬戶頁面看起來是這樣的:
<body>
<div id="CreateAccount" data-role="page">
<script type="text/javascript">
$(document).on('pageinit pageshow', 'div:jqmData(role="page"), div:jqmData(role="dialog")', function(){
if($("form.validate").length > 0){
$("form.validate").validate({
rules: {
firstname: {
required: true,
minlength: 2
},
lastname: {
required: true,
minlength: 2
},
email_address: {
required: true,
email: true
},
password: "required"
}
});
}
});
</script>
<form name="create_account" method="post" class="validate">
<label class="inputLabel" for="create-account-firstname">First Name:</label>
<input type="text" name="firstname" size = "41" maxlength= "96" id="create-account-firstname" />
<label class="inputLabel" for="create-account-lastname">Last Name:</label>
<input type="text" name="lastname" size = "41" maxlength= "96" id="create-account-lastname" />
<label class="inputLabel" for="create-account-email-address">Email Address:</label>
<input type="email" name="email_address" size="18" id="create-account-email-address" />
<label class="inputLabel" for="create-account-password">Password:</label>
<input type="password" name="password" size="18" id="create-account-password" />
<input type="submit" value="Submit" data-icon="lock" data-mini="true" alt="Submit" title=" Submit " />
</form>
</div>
</body>
如果我打這個頁面上的提交按鈕,只有電子郵件地址和密碼進行驗證。我假設這是因爲它仍然從登錄頁面運行驗證規則而不是創建帳戶頁面?如果我點擊瀏覽器刷新,那麼提交按鈕的所有4個字段都會被驗證。
如何獲得正確的表單驗證?
正好......第二個人已經有了一個唯一的名字,所以你可以使用'$('form [name =「create_account」]')。validate(...' – Ryley 2012-07-30 15:31:02