<
form
id
="form1"
runat
="server"
>
<
div
align
="center"
>
<
fieldset
style
="width: 350px; height: 200px;"
>
<
table
border
="0"
cellpadding
="3"
cellspacing
="3"
>
<
tr
>
<
td
>
請選擇汽車類型：
</
td
>
</
tr
>
<
tr
>
<
td
>
<
asp:ListBox
ID
="lstCar"
runat
="server"
Rows
="5"
SelectionMode
="Multiple"
>
<
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
="現代汽車"
></
asp:ListItem
>
<
asp:ListItem
Value
="5"
Text
="豐田汽車"
></
asp:ListItem
>
</
asp:ListBox
>
</
td
>
</
tr
>
<
tr
>
<
td
>
<
asp:Button
ID
="btnSubmit"
runat
="server"
Text
="提交"
/>
</
td
>
</
tr
>
</
table
>
</
fieldset
>
<
div
id
="message"
class
="alertmsg"
>
</
div
>
</
div
>
</
form
>
<
head
id
="Head1"
runat
="server"
>
<
title
>
Recipe17
</
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({
rules: {
lstCar: { required:
true
, rangelength: [
0
,
4
] }
},
messages: {
lstCar: { required:
"
至少選擇一種車！
"
,
rangelength:
"
選擇的范圍為零到四種車！
"
}
},
errorLabelContainer: $(
"
#message
"
)
});
});
</
script
>
<
style
type
="text/css"
>
.alertmsg
{
color
:
#FF0000
;
}
</
style
>
</
head
>