Interface code:
Copy Code code as follows:
<form id= "Form1" runat= "Server" >
<div align= "Left" >
<fieldset style= "width:400px; height:150px ">
<p>
Please choose language </p>
<asp:checkboxlist id= "Ckblistpro" runat= "Server" >
<asp:listitem value= "1" text= "C #" ></asp:ListItem>
<asp:listitem value= "2" text= "JAVA" ></asp:ListItem>
<asp:listitem value= "3" text= "C + +" ></asp:ListItem>
<asp:listitem value= "4" text= "JavaScript" ></asp:ListItem>
</asp:CheckBoxList>
</fieldset>
<br/>
<div id= "message" style= "color:red;" ></div>
</div>
</form>
Display effect:
Implement the selected language and display the Content scripting code:
Copy Code code as follows:
<script src= "Scripts/jquery-1.4.1-vsdoc.js" type= "Text/javascript" ></script>
<script type= "Text/javascript" >
$ (document). Ready (function () {
CheckBoxList is converted to <table id= "Ckblistpro" when the page is rendered >
Member ListItem convert to <input type= "checkbox" ><label>
$ ("#<%=ckblistpro.clientid%>"). Click (function () {
var str = "";
This gets to the selected <input type= "checkbox" >
$ ("#<%=ckblistpro.clientid%> input[type=checkbox]:checked"). each (function () {
str = str + $ (this). Val () + ":" + $ (this). Next (). Text () + ""; Here Next () represents the <label>
});
$ ("#message"). Text (str);
});
});
</script>
Select Language Post interface: