兩種不同的表單驗證

Question

我有一個包含提交按鈕的表單。我正在使用form.validation插件

我已經設置了規則。沒關係！

但現在我創建了一個鏈接表單，當用戶點擊時，我想改變這些規則。可能嗎？

例如：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js"></script> 
<script type="text/javascript"> 
$().ready(function() { 
    $(".myform").validate({ 
     rules: { 
      name: { 
       required: true 
      }, 
      email: { 
       required: true 
      }, 
     } 
    }); 
}); 
</script> 
<form class="myform"> 
    Name: <input type="text" name="name"> 
    Email: <input type="text" name="email"> 
    Phone: <input type="text" name="phone"> 
    <input type="submit" value="Send"> 
</form> 
<a href="#">Call me</a> 

當上「叫我」的用戶點擊，確認是只有「手機」領域。

Answer 1

有很多不對的代碼都語法和結構

<script type="text/javascript"> 
$().ready(function() { 
$(".myform").validate({ 
    rules: { 
     name: { 
      required: true 
     }, 
     email: { 
      required: true 
     }, 
    } 
}); 
}); 
</script> 
<form class="myform"> 
Name: <input type="text" name="name"> 
Email: <input type="text" name="email"> 
Phone: <input type="text" name="phone"> 
</form> 
<a href="#">Call me</a> 

應該看起來更像

<script type="text/javascript"> 
$(document).ready(function() { 
$("#callme").click(function(){ 
    $(".myform").validate({ 
    rules: { 
     phone: { 
      required: true 
     } 
    /*note the removed ,*/ 
    } 
}); 
}); 
$("#submit").click(function(){ 
$(".myform").validate({ 
    rules: { 
     name: { 
      required: true 
     }, 
     email: { 
      required: true 
     } 
    /*note the removed ,*/ 
    } 
}); 
}); 
}); 
</script> 
<!-- Your Form must have a method attribute either post or get //--> 
<form class="myform" method="post" action=""> 
<label for="name">Name:</label> <input type="text" name="name" id="name"> 
<label for="email">Email:</label> <input type="text" name="email" id="email"> 
<label for="phone">Phone:</label> <input type="text" name="phone" id="phone"> 
<!-- Hide this label with css //--> 
<label for="submit" class="hidden">submit:</label><input type="submit" value="submit" text="submit" id="submit" /> 
</form> 
<!-- Link this to another form with new js validation rules //--> 
<a href="#" id="callme">Call me</a> 

Answer 2

在我看來，你需要做的是點擊您的鏈接時，下列（全部在javascript/jQuery中）：

• 取消鏈接的默認動作;
• 從name和email中刪除規則;
• 將新規則添加到phone字段;
• 可以隱藏除phone字段以外的所有字段。

您可以在插件的文檔的rules section中找到更多詳細信息。

Answer 3

這種方式奏效。在我的測試中，我看到：

• 不能是鏈接
• Cannou出的

有人可以證實？

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
$("#submit1").click(function(){ 
    $(".myform").validate({ 
    rules: { 
     phone: { 
      required: true 
     } 
    } 
}); 
}); 
$("#submit").click(function(){ 
$(".myform").validate({ 
    rules: { 
     name: { 
      required: true 
     }, 
     email: { 
      required: true 
     } 
    } 
}); 
}); 
}); 
</script> 
<!-- Your Form must have a method attribute either post or get //--> 
<form class="myform" method="post" action=""> 
<label for="name">Name:</label> <input type="text" name="name" id="name"> 
<label for="email">Email:</label> <input type="text" name="email" id="email"> 
<label for="phone">Phone:</label> <input type="text" name="phone" id="phone"> 
<!-- Hide this label with css //--> 
<input type="submit" value="submit" text="submit" id="submit" /> 
<input type="submit" value="submit1" text="submit" id="submit1" /> 
</form> 
<!-- Link this to another form with new js validation rules //-->