快捷導(dǎo)航

jQuery form 表單驗(yàn)證插件(fieldValue)校驗(yàn)表單

更新時(shí)間：2016年01月24日 16:19:39 作者：daliu_it

這篇文章主要介紹了jQuery form 表單驗(yàn)證插件(fieldValue)校驗(yàn)表單的相關(guān)資料,需要的朋友可以參考下

jQuery form表單驗(yàn)證相關(guān)知識(shí)，在做項(xiàng)目中經(jīng)常會(huì)用到，其實(shí)也不算復(fù)雜，下面通過(guò)一段代碼給大家介紹jQuery form 表單驗(yàn)證插件(fieldValue)校驗(yàn)表單的相關(guān)知識(shí)，感興趣的朋友一起學(xué)習(xí)吧

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>jQuery form插件的使用--使用 fieldValue 方法校驗(yàn)表單.</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script src="jquery-1.3.1.js" type="text/javascript"></script>
<script src="jquery.form.js" type="text/javascript"></script>
<script type="text/javascript"> 
$(document).ready(function() { 
$('#myForm').ajaxForm({ 
target: '#output1', // 用服務(wù)器返回的數(shù)據(jù) 更新 id為output1的內(nèi)容.
beforeSubmit: validate // 提交前，驗(yàn)證
}); 
});
function validate(formData, jqForm, options) { 
// fieldValue 是表單插件的一個(gè)方法，它能找出表單中的元素的值，返回一個(gè)集合。
var usernameValue = $('input[name=name]').fieldValue(); 
var addressValue = $('input[name=address]').fieldValue(); 
if (!usernameValue[0] || !addressValue[0]) { 
alert('用戶名和地址不能為空，自我介紹可以為空！'); 
return false; 
} 
var queryString = $.param(formData); //組裝數(shù)據(jù)
//alert(queryString); //類似 ： name=1&add=2 
return true; 
}
</script> 
</head>
<body>
<h3> Demo 7 : jQuery form插件的使用--使用 fieldValue 方法校驗(yàn)表單. </h3>
<!-- demo1 -->
<form id="myForm" action="ajax2.jsp" method="post"> 
名稱： <input type="text" name="name" id="name" /> <br/>
地址： <input type="text" name="address" id="address"/><br/> 
自我介紹： <textarea name="comment" id="comment" ></textarea> <br/>
<input type="submit" id="test" value="提交" /> <br/>
<div id="output1" ></div>
</form>
</body>
</html>

以上所述是針對(duì)jQuery form 表單驗(yàn)證插件(fieldValue)校驗(yàn)表單的相關(guān)內(nèi)容，希望大家喜歡。

您可能感興趣的文章:

相關(guān)文章

使用jquery.upload.js實(shí)現(xiàn)異步上傳示例代碼
這篇文章主要介紹了使用jquery.upload.js實(shí)現(xiàn)異步上傳的示例代碼,需要的朋友可以參考下
2014-07-07
JQuery中$之選擇器用法介紹
在jQuery 中$("<span>")，這個(gè)語(yǔ)法等同于$(document.createElement("span")) ，這是一種用法
2011-04-04
jQuery生成asp.net服務(wù)器控件的代碼
jQuery生成asp.net服務(wù)器控件但不幸的是，該服務(wù)器控件依然沒(méi)有起作用，還是用隱藏服務(wù)器控件來(lái)解決吧
2010-02-02
jQuery+canvas實(shí)現(xiàn)的球體平拋及顏色動(dòng)態(tài)變換效果
這篇文章主要介紹了jQuery+canvas實(shí)現(xiàn)的球體平拋及顏色動(dòng)態(tài)變換效果,通過(guò)jQuery結(jié)合html5的canvas技術(shù)調(diào)用時(shí)間函數(shù)實(shí)時(shí)進(jìn)行數(shù)學(xué)運(yùn)算,最終實(shí)現(xiàn)球體平拋及顏色動(dòng)態(tài)變換的效果,需要的朋友可以參考下
2016-01-01
精心挑選的15款優(yōu)秀jQuery 本特效插件和教程
今天這篇文章向大家分享15款精心挑選的優(yōu)秀 jQuery 文本特效插件，都帶有詳細(xì)的使用教程。jQuery 是最流行和使用最廣泛的 JavaScript 框架，它簡(jiǎn)化了 HTML 文檔遍歷，事件處理，動(dòng)畫以及Ajax交互，幫助 Web 開(kāi)發(fā)人員更快速的實(shí)現(xiàn)各種精美的界面效果
2012-08-08
JavaScript與JQUERY獲取元素的寬、高和位置
文章給大家匯總整理了JavaScript以及jQuery獲取元素高寬和位置等信息的方法，非常的全面，小伙伴們可以記錄下以便查看
2017-02-02
Jquery ajaxsubmit上傳圖片實(shí)現(xiàn)代碼
這是數(shù)月前的事情了，場(chǎng)景是這樣的：在進(jìn)行圖片上傳的時(shí)，我發(fā)現(xiàn)開(kāi)發(fā)人員使用的上傳圖片方式是Iframe + 傳統(tǒng)的 http post 來(lái)處理的。
2010-11-11
Jquery 實(shí)現(xiàn)Tab效果思路是js思路
Jquery 實(shí)現(xiàn)Tab效果，思路就是普通的用js的思路控制的，腳本之家發(fā)布過(guò)更精簡(jiǎn)的代碼，這個(gè)比較適合一直用js開(kāi)始學(xué)用jquery控制的朋友一個(gè)參考。
2010-03-03
jQuery中serializeArray()與serialize()的區(qū)別實(shí)例分析
這篇文章主要介紹了jQuery中serializeArray()與serialize()的區(qū)別,結(jié)合實(shí)例形式分析了jQuery中serializeArray()與serialize()的具體功能、使用技巧與用法區(qū)別,需要的朋友可以參考下
2015-12-12
jQuery中addClass()方法用法實(shí)例
這篇文章主要介紹了jQuery中addClass()方法用法,實(shí)例分析了addClass()方法的功能、定義及向匹配元素添加一個(gè)或多個(gè)類的使用技巧,需要的朋友可以參考下
2015-01-01