 
<form id="form1" runat="server"> 
<div align="center"> 
<fieldset style="width: 350px; height: 200px;"> 
<table border="0" cellpadding="3" cellspacing="3"> 
<tr> 
<td> 
請(qǐng)選擇汽車類型： 
</td> 
</tr> 
<tr> 
<td> 
<asp:DropDownList ID="dllCar" runat="server" ToolTip="至少選擇一種車！" CssClass="required"> 
<asp:ListItem Value="" Text="---請(qǐng)選擇---"></asp:ListItem> 
<asp:ListItem Value="1" Text="奔馳汽車"></asp:ListItem> 
<asp:ListItem Value="2" Text="寶馬汽車"></asp:ListItem> 
<asp:ListItem Value="3" Text="奧迪汽車"></asp:ListItem> 
<asp:ListItem Value="4" Text="現(xiàn)代汽車"></asp:ListItem> 
<asp:ListItem Value="5" Text="豐田汽車"></asp:ListItem> 
</asp:DropDownList> 
</td> 
</tr> 
<tr> 
<td> 
<asp:Button ID="btnSubmit" runat="server" Text="提交" /> 
</td> 
</tr> 
</table> 
</fieldset> 
<div id="message" class="alertmsg"> 
</div> 
</div> 
</form> 

DropDownList控件屬性ToolTip會(huì)轉(zhuǎn)換為Title，title的值可以作為校驗(yàn)規(guī)則required的提示信息，屬性CssClass的值required就指定了插件的校驗(yàn)規(guī)則。

腳本代碼：

復(fù)制代碼代碼如下:

 
<head id="Head1" runat="server"> 
<title>Recipe18</title> 
<script type="text/javascript" src="Scripts/jquery-1.4.1-vsdoc.js"></script> 
<script type="text/javascript" src="Scripts/jquery.validate.js"></script> 
<script type="text/javascript"> 
$(function () { 
$("#form1").validate({ 
errorLabelContainer: $("#message") 
}); 
}); 
</script> 
<style type="text/css"> 
.alertmsg 
{ 
color: #FF0000; 
} 
</style> 
</head> 

顯示效果：

另外如果不設(shè)置DropDownList的屬性ToolTip和CssClass,腳本代碼改為如下，也可以實(shí)現(xiàn)同樣的效果：

復(fù)制代碼代碼如下:

 
<script type="text/javascript"> 
$(function () { 
$("#form1").validate({ 
rules: { dllCar: "required" }, 
messages: { dllCar: "至少選擇一種車！" }, 
errorLabelContainer: $("#message") 
}); 
}); 
</script> 

您可能感興趣的文章:

相關(guān)文章

詳解jQuery-each()方法
這篇文章主要介紹了jQuery-each()方法，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-03-03
基于jquery的圖片懶加載js
在京東商城瀏覽時(shí), 會(huì)發(fā)現(xiàn)產(chǎn)品圖片只顯示了一屏, 當(dāng)頁(yè)面向下滾動(dòng)時(shí)下面的產(chǎn)品圖片才逐漸加載.
2010-06-06
JQuery實(shí)現(xiàn)倒計(jì)時(shí)按鈕具體方法
頁(yè)面中需要實(shí)現(xiàn)某個(gè)按鈕點(diǎn)擊完后，禁用它，并顯示倒計(jì)時(shí)。這個(gè)默認(rèn)是3秒，代碼如下
2013-11-11
$.getJSON在IE下失效的原因分析及解決方法
getJson在IE下IE下默認(rèn)會(huì)使用瀏覽器緩存，所以導(dǎo)致數(shù)據(jù)不顯示，讓其不要使用緩存便可解決
2013-06-06
js根據(jù)json數(shù)據(jù)中的某一個(gè)屬性來(lái)給數(shù)據(jù)分組的方法
今天小編就為大家分享一篇js根據(jù)json數(shù)據(jù)中的某一個(gè)屬性來(lái)給數(shù)據(jù)分組的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2018-10-10
jQuery插件ajaxfileupload.js實(shí)現(xiàn)上傳文件
這篇文章主要為大家詳細(xì)介紹了jQuery插件ajaxfileupload.js實(shí)現(xiàn)上傳文件的相關(guān)資料，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-05-05
Jquery中Ajax 緩存帶來(lái)的影響的解決方法
最近項(xiàng)目中遇見(jiàn) Jquery Ajax 緩存問(wèn)題,load出來(lái)的頁(yè)面狀態(tài)有時(shí)正常，有時(shí)不對(duì)，記錄一下，希望對(duì)大家有幫助
2011-05-05
淺談jQuery的bind和unbind事件(綁定和解綁事件)
下面小編就為大家?guī)?lái)一篇淺談jQuery的bind和unbind事件(綁定和解綁事件)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-03-03
JQuery表格拖動(dòng)調(diào)整列寬效果(自己動(dòng)手寫(xiě)的)
當(dāng)鼠標(biāo)停留在表頭邊框線上時(shí)，鼠標(biāo)會(huì)變成表示左右拖動(dòng)的形狀，接著拖動(dòng)鼠標(biāo)，會(huì)在表格中出現(xiàn)一條隨鼠標(biāo)移動(dòng)的豎線，最后放開(kāi)鼠標(biāo)，表格列寬會(huì)被調(diào)整
2014-09-09
jquery模擬按下回車實(shí)現(xiàn)代碼
今天要實(shí)現(xiàn)一個(gè)回車事件，一開(kāi)始用了 js 的方法，怎么都不行，原來(lái)JQuery有點(diǎn)不同于JS的，而且比起JS簡(jiǎn)單多了
2011-09-09