jquery 實作表單驗證功能碼(簡潔)_jquery

1. 頁面效果，自動提示驗證信息...

2. 頁面代碼

複製代碼 程式碼如下:

>





$(function () {
//載入驗證資訊
$(' # uiform input').each(function () {
if ($(this).attr('required') ) || $(this).attr('validType'))
$(this) . validatebox();
})
$('#ajax_test2').click(function () {
$.ajax({
url: "../Handler1.ashx?Menthod=登入",
類型: 'post',
資料: {name:"123456"},
逾時: 30000,
beforeSend: function (XMLHttpRequest) {
//alert('遠端呼叫開始...');
$("#loading").html("");
},
成功: function (data, textStatus) {
alert('開始回調，狀態文字值：'textStatus '傳回資料：'data);
$("#loading").empty();
},
complete: function (XMLHttpRequest, textStatus) {
alert('呼叫遠端，狀態成功文字值：' textStatus);
$("#loading").empty();
},
錯誤: function (XMLHttpRequest, textStatus, errorThrown) {
alert('錯誤...狀態文字值：' textStatus " 例外訊息：" errorThrown);
$("#loading").empty();
}
}); "#btn").click(function () {
var flag = true;
flag = $("#uiform").form("validate");
// $('#uiform input').each(function () {
// if ($(this).attr('required') || $(this).attr('validType')) {
// if ( !$(this).validatebox('isValid')) {
// flag = false;
//回傳；
// }
// }
// })
if (flag) {
$("#uiform").form("destroy");
alert('驗證通過！'）;
}
});
});
腳本>

#name
{
寬度：191px;
}
.style4
{
寬度：100px;
}
.style5
{
寬度：98px；
}
{
寬度：98px;
}
#txt密碼
{
寬度：150px;
}
.style7
{
寬度：371px;
}
.style8
.style8
🎜>寬度：420px;
}
#btn
{
寬度：86px;
}
.style9
{
寬度：100px； ：26px；
}
.style10
{
寬度：371px；
高度：26px；
}
.style11
{
寬度：98px；
高度：26px;
}
.style12
{
寬度：420px;
高度：26px;
}
.style13
{
{
{
{
{
{
{
{
{
{
{
{
{
{
{
寬度：100px；
高度：25px；
}
.style14
{
寬度：371px；
高度：25px；
}
.style15
{
寬度：98px；
高度：25px；
}
.style16
{
寬度：420px；
高度：25px；
}

頭>

 
>
;

登入名稱：

真實姓名：


登入密碼：

郵箱：



身分證號碼：
QQ：



手機：
電話：


郵編： id="txtZIP" name=" txtZIP " type="text" class="txt03" /> 年齡： id="txtZIP0" name="txtZIP0" type="text" class="txt03" /> 備註： 文字區域> style="width:41%; height: 74px;" class="txt03" id="txtRemark">   超級管理員;  停用 text td> missingMessage="文字方塊為空白時出現的提示文字。" invalidMessage="當文字方塊的內容無效時出現的提示文字" required="true" validType="minLength[5]" />


文字方塊比對：
2 

---