你是否被頁(yè)面上這樣的驗(yàn)證煩死：
function checkForm()
{
if(document.getElementById("<%=this.textbox1.ClientID%>").value.length ==0)
{
alert("不能為空");
return false;
}
｝
又或者你已經(jīng)封裝了JS庫(kù)，又或者你在用一些JS驗(yàn)證插件，但是還是得不停的一遍一遍寫著正則,提示信息，等待返回結(jié)果.恩，我跟你一樣，也煩透了！于是，我便做了個(gè)毛坯，到今天，把這個(gè)毛坯蓋成了個(gè)茅草屋。好吧，來(lái)看看驗(yàn)證要做些什么工作吧。
介紹與使用
Step 1:引入JS文件和CSS文件
Step 2:拖入一個(gè)驗(yàn)證控件 選擇驗(yàn)證類型，能否為空，提示信息等自己所需要的東西，這個(gè)例子中，我只選擇了驗(yàn)證類型為郵箱，然后默認(rèn)的允許為空改成了NO，不允許為空，其余都使用默認(rèn)設(shè)置,
Step 3:開始吧
3.1: 這時(shí)候，鼠標(biāo)hover上文本框的時(shí)候，右邊出現(xiàn)了默認(rèn)的提示，當(dāng)然，有時(shí)候根據(jù)布局，你也可以調(diào)整Tip的方向,忘了說(shuō)了，頁(yè)面上還放了個(gè)提交按鈕，給它添加了一個(gè)客戶端事件
3.2: 點(diǎn)擊提交按鈕，頁(yè)面無(wú)變化，驗(yàn)證不通過(guò)
3.3: 輸入不匹配的字符，當(dāng)文本框失去焦點(diǎn)的時(shí)候，提示驗(yàn)證沒通過(guò)
3.4:輸入格式正確，OK
恩，其實(shí)驗(yàn)證我們就選了兩下，驗(yàn)證就搞定了，我覺得蠻好，你覺得呢?
其實(shí)文本框的完成，基本的驗(yàn)證已經(jīng)可以了，但是還有諸多的控件radio,radiobuttonlist,check,checkboxlist,select... 去他大爺?shù)?OK,罵了它我也心里爽多了，繼續(xù)吧：
OK，都可以了，只是驗(yàn)證提醒的樣式忒丑了點(diǎn)，而且在IE下有更丑，如果您有更好看的實(shí)現(xiàn)，請(qǐng)發(fā)一份給我，我JS和CSS很差 ：P，感激不盡。
原理
看下源代碼，什么都知道了，Textbox通過(guò)瀏覽器查看到的HTML代碼是：
<input type="text" canempty="No" tip="請(qǐng)輸入正確的郵箱地址格式" reg="^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$" id="TCTextBox1" name="TCTextBox1" gtbfieldid="19" class="verifyfailure">
Select，CheckboxList，Checkbox的HTML代碼是：
<select reg="0{1,}" tip="請(qǐng)選者一個(gè)" id="DropDownList1" name="DropDownList1" gtbfieldid="20" class="verifyfailure">
<option value="" selected="selected"></option>
<option value="aaaaaaa">aaaaaaa</option>
<option value="bbbbbbb">bbbbbbb</option>
<option value="cvvvvvv">cvvvvvv</option>
</select>
<table border="0" reg="0{3,}" tip="請(qǐng)選者3個(gè)" id="CheckBoxList1" original-title="" class="verifyfailure">
<tbody><tr>
<td><input type="checkbox" name="CheckBoxList1$0" id="CheckBoxList1_0"><label for="CheckBoxList1_0">aaaa</label></td><td><input type="checkbox" name="CheckBoxList1$1" id="CheckBoxList1_1"><label for="CheckBoxList1_1">bbb</label></td><td><input type="checkbox" name="CheckBoxList1$2" id="CheckBoxList1_2"><label for="CheckBoxList1_2">ccc</label></td>
</tr>
</tbody></table>
<span reg="0{1,}" tip="請(qǐng)選者" class="verifyfailure"><input type="radio" value="RadioButton1" name="RadioButton1" id="RadioButton1"></span>
恩，擴(kuò)展TextBox控件，添加了自定義屬性reg 正則表達(dá)式,tip 提示信息,canempty 能否為空,然后用JS進(jìn)行正則驗(yàn)證，通過(guò)驗(yàn)證的結(jié)果來(lái)添加 刪除CSS，這里要注意的是，checkbox，radio生成出來(lái)的代碼多了一個(gè)SPAN標(biāo)簽，checkboxlist，radiobuttonlist生成出來(lái)之后多了table標(biāo)簽，在JS文件中，我把它們的驗(yàn)證和文本框的驗(yàn)證分開了，獨(dú)立了一個(gè)checkAspnetRadioCheckbox方法來(lái)進(jìn)行驗(yàn)證。本來(lái)可以擴(kuò)展這些控件來(lái)添加標(biāo)簽，但是我覺得驗(yàn)證控件一多，對(duì)程序員反而是不好的事，找還找半天。權(quán)衡一下，還是用丑陋的方法實(shí)現(xiàn)比較劃得來(lái)。
喜歡 
頂
難過(guò)
囧
圍觀
無(wú)聊
