課程
/前端開發
/jQuery
/jQuery插件——Validation Plugin
有沒有什么辦法解決,這個 validate插件。一般的AJAX都是通過 type="button" 傳輸的
2016-06-07
源自:jQuery插件——Validation Plugin 1-2
正在回答
一個表單中必須有一個submit,用來提交表單數據,后臺的驗證在提交時就根據你所設定的$("#form1").validate,這個進行驗證,并出現相應的提示信息。
如果改成button,也是可以的,但沒必要吧,自己給這個btn綁定一個事件,來進行驗證,效果一樣,但submit是提交整個表單的數據。
至于后臺驗證?是指這個WEB端的驗證,還是PHP那里的驗證呢?如果是前者,簡單的話使用submitHandler,使用AJAX,如果是PHP那里的話,咱們就約定好JSON數據格式就好了。
underfineded 提問者
慕絲4635624 回復 underfineded 提問者
underfineded 提問者 回復 慕絲4635624
<script type="text/javascript"> ? ? ? ?$(function () { ? ? ? ? ? ?$("#form1").validate({ ? ? ? ? ? ? ? ?rules: { ? ? ? ? ? ? ? ? ? ?UserName: { required: true, minlength: 3, maxlength: 18, remote: "/Home/CheckUserName" }, ? ? ? ? ? ? ? ? ? ?Email: { required: true,email:true }, ? ? ? ? ? ? ? ? ? ?UserPassword: { required: true ,minlength: 6 }, ? ? ? ? ? ? ? ? ? ?Mobile: { required: true, number:true }, ? ? ? ? ? ? ? ? ? ?IdCard: { required: true,isIdCardNo: true }, ? ? ? ? ? ? ? ? ? ?Age: { required: true ,number:true,min:1,max:100 } ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ?messages:{ ? ? ? ? ? ? ? ? ? ?UserName: { ? ? ? ? ? ? ? ? ? ? ? ?required: "請輸入用戶名!", ? ? ? ? ? ? ? ? ? ? ? ?minlength: "用戶名長度最少需要3位!", ? ? ? ? ? ? ? ? ? ? ? ?maxlength: "用戶名長度最大不能超過18位!", ? ? ? ? ? ? ? ? ? ? ? ?remote: "此用戶名已存在!" ? ? ? ? ? ? ? ? ? ? }, ? ? ? ? ? ? ? ? ? ?Email: { ? ? ? ? ? ? ? ? ? ? ? ?required: "請填寫郵箱", ? ? ? ? ? ? ? ? ? ? ? ?email: "請輸入正確的郵箱格式" ? ? ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ? ? ?UserPassword: { ? ? ? ? ? ? ? ? ? ? ? ?required: "請填寫你的密碼!", ? ? ? ? ? ? ? ? ? ? ? ?minlength: "密碼長度不能小于6位" ? ? ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ? ? ?Mobile: { ? ? ? ? ? ? ? ? ? ? ? ?required: "請填寫你的手機號碼", ? ? ? ? ? ? ? ? ? ? ? ?number:"手機號碼只能為數字" ? ? ? ? ? ? ? ? ? ? }, ? ? ? ? ? ? ? ? ? ?IdCard: { ? ? ? ? ? ? ? ? ? ? ? ?required: "請輸入身份證號碼!", ? ? ? ? ? ? ? ? ? ? ? ?isIdCardNo:"請輸入正確的身份證號碼!" ? ? ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ? ? ?Age: { ? ? ? ? ? ? ? ? ? ? ? ?required: "請輸入年齡!", ? ? ? ? ? ? ? ? ? ? ? ?number: "請輸入數字", ? ? ? ? ? ? ? ? ? ? ? ?min: "年齡不能小于1", ? ? ? ? ? ? ? ? ? ? ? ?max: "年齡不能大于100" ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ?/*錯誤提示位置*/ ? ? ? ? ? ? ? ?errorPlacement: function (error, element) { ? ? ? ? ? ? ? ? ? ?error.appendTo(element.parent()); ? ? ? ? ? ? ? ?} ? ? ? ? ? ?}) ? ? ? ?}) ? ?</script></head><body> ? ?<form id="form1" method="post" action=""> ? ? ? ?<div> ? ? ? ?<p> 用戶名:<input type="text" value="" name="UserName" /> </p> ? ? ? ?<p> 密碼:<input type="password" value="" name="UserPassword" /> </p> ? ? ? ?<p> 郵箱:<input type="text" value="" name="Email" /> </p> ? ? ? ?<p> 手機號碼:<input type="text" value="" name="Mobile" /> </p> ? ? ? ?<p> 身份證號碼:<input type="text" value="" name="IdCard" /> </p> ? ? ? ?<p> 年齡:<input type="text" value="" name="Age" /> </p> ? ? ? ?<p> <input type="submit" id="btn1" value="提交"></p> ? ? ? ?</div> ? ?</form></body>
-------------
這邊的p> <input type="submit" id="btn1" value="提交"></p> ?type="submit"可以改成type="button"嗎?submit 就直接提交了。沒法進行后臺驗證了
代碼放出來
舉報
validation讓客戶端表單驗證變容易,縮短用戶等待時間
1 回答jQuery Validate 登錄的時候只能使用submit
2 回答使用插件時,沒有代碼提示,怎解決?
1 回答jquery.validate.js 實時驗證
3 回答難道不支持firefox?,用safari可以,firefox沒用啊
1 回答?。?!就是沒有效果呀,代碼正確,引入地址也是對的
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2016-06-08
一個表單中必須有一個submit,用來提交表單數據,后臺的驗證在提交時就根據你所設定的$("#form1").validate,這個進行驗證,并出現相應的提示信息。
如果改成button,也是可以的,但沒必要吧,自己給這個btn綁定一個事件,來進行驗證,效果一樣,但submit是提交整個表單的數據。
至于后臺驗證?是指這個WEB端的驗證,還是PHP那里的驗證呢?如果是前者,簡單的話使用submitHandler,使用AJAX,如果是PHP那里的話,咱們就約定好JSON數據格式就好了。
2016-06-08
<script type="text/javascript">
? ? ? ?$(function () {
? ? ? ? ? ?$("#form1").validate({
? ? ? ? ? ? ? ?rules: {
? ? ? ? ? ? ? ? ? ?UserName: { required: true, minlength: 3, maxlength: 18, remote: "/Home/CheckUserName" },
? ? ? ? ? ? ? ? ? ?Email: { required: true,email:true },
? ? ? ? ? ? ? ? ? ?UserPassword: { required: true ,minlength: 6 },
? ? ? ? ? ? ? ? ? ?Mobile: { required: true, number:true },
? ? ? ? ? ? ? ? ? ?IdCard: { required: true,isIdCardNo: true },
? ? ? ? ? ? ? ? ? ?Age: { required: true ,number:true,min:1,max:100 }
? ? ? ? ? ? ? ?},
? ? ? ? ? ? ? ?messages:{
? ? ? ? ? ? ? ? ? ?UserName: {
? ? ? ? ? ? ? ? ? ? ? ?required: "請輸入用戶名!",
? ? ? ? ? ? ? ? ? ? ? ?minlength: "用戶名長度最少需要3位!",
? ? ? ? ? ? ? ? ? ? ? ?maxlength: "用戶名長度最大不能超過18位!",
? ? ? ? ? ? ? ? ? ? ? ?remote: "此用戶名已存在!"
? ? ? ? ? ? ? ? ? ? },
? ? ? ? ? ? ? ? ? ?Email: {
? ? ? ? ? ? ? ? ? ? ? ?required: "請填寫郵箱",
? ? ? ? ? ? ? ? ? ? ? ?email: "請輸入正確的郵箱格式"
? ? ? ? ? ? ? ? ? ?},
? ? ? ? ? ? ? ? ? ?UserPassword: {
? ? ? ? ? ? ? ? ? ? ? ?required: "請填寫你的密碼!",
? ? ? ? ? ? ? ? ? ? ? ?minlength: "密碼長度不能小于6位"
? ? ? ? ? ? ? ? ? ?},
? ? ? ? ? ? ? ? ? ?Mobile: {
? ? ? ? ? ? ? ? ? ? ? ?required: "請填寫你的手機號碼",
? ? ? ? ? ? ? ? ? ? ? ?number:"手機號碼只能為數字"
? ? ? ? ? ? ? ? ? ? },
? ? ? ? ? ? ? ? ? ?IdCard: {
? ? ? ? ? ? ? ? ? ? ? ?required: "請輸入身份證號碼!",
? ? ? ? ? ? ? ? ? ? ? ?isIdCardNo:"請輸入正確的身份證號碼!"
? ? ? ? ? ? ? ? ? ?},
? ? ? ? ? ? ? ? ? ?Age: {
? ? ? ? ? ? ? ? ? ? ? ?required: "請輸入年齡!",
? ? ? ? ? ? ? ? ? ? ? ?number: "請輸入數字",
? ? ? ? ? ? ? ? ? ? ? ?min: "年齡不能小于1",
? ? ? ? ? ? ? ? ? ? ? ?max: "年齡不能大于100"
? ? ? ? ? ? ? ? ? ?}
? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ?/*錯誤提示位置*/
? ? ? ? ? ? ? ?errorPlacement: function (error, element) {
? ? ? ? ? ? ? ? ? ?error.appendTo(element.parent());
? ? ? ? ? ? ? ?}
? ? ? ? ? ?})
? ? ? ?}) ? ?</script></head><body>
? ?<form id="form1" method="post" action="">
? ? ? ?<div>
? ? ? ?<p> 用戶名:<input type="text" value="" name="UserName" /> </p>
? ? ? ?<p> 密碼:<input type="password" value="" name="UserPassword" /> </p>
? ? ? ?<p> 郵箱:<input type="text" value="" name="Email" /> </p>
? ? ? ?<p> 手機號碼:<input type="text" value="" name="Mobile" /> </p>
? ? ? ?<p> 身份證號碼:<input type="text" value="" name="IdCard" /> </p>
? ? ? ?<p> 年齡:<input type="text" value="" name="Age" /> </p>
? ? ? ?<p> <input type="submit" id="btn1" value="提交"></p>
? ? ? ?</div>
? ?</form></body>
-------------
這邊的p> <input type="submit" id="btn1" value="提交"></p> ?type="submit"可以改成type="button"嗎?submit 就直接提交了。沒法進行后臺驗證了
2016-06-08
代碼放出來