JQuery method for obtaining the value of checkboxlist _ jquery

Recently I started a project and used the server space checkboxlist. It is convenient to use. It is a little troublesome to get the value from js. google found the following method, if you are interested, you can refer to the CheckboxList as a server control. It is easy to bind data and to obtain the selected value on the server. However, the generated static page does not have the Value of ListItem, so by default, the Value of ListItem cannot be obtained in the page using js. I don't know why the value is not displayed. This article provides a method for getting the checkboxlist value using jQuery.

First look at the original page html code:

The following code binds checkboxlist:

If (dt! = Null & dt. rows. count> 0) {foreach (DataRow dr in dt. rows) {// The text value and value listTest respectively. items. add (new ListItem (dr ["Title"]. toString (), dr ["ID"]. toString ()));}}

The html code generated on the page is as follows:

 
 
 
  
  
 
   
 
    
  A vibration effect based on jQuery 
 
   
 
   
 
    
 Use the overflow attribute of css to change the thumbnail size. 
 
   
 
  
 
 

It can be seen that the checkboxlist is converted into a table with no value. The value in the label, that is, the text value. When you click it, you can also select checkbox, which improves the user experience.
Next we will go to our processing process. First, when we bind the checkboxlist, we will add an alt attribute for each object in ListItem to save the corresponding value. The Code is as follows:

If (dt! = Null & dt. rows. count> 0) {foreach (DataRow dr in dt. rows) {// The text value and value listTest respectively. items. add (new ListItem (dr ["Title"]. toString (), dr ["ID"]. toString ();} // Add the alt attribute to the ListItem object, and save the value foreach (ListItem li in listTest. items) {li. attributes. add ("alt", li. value );}}

The generated html code is as follows:

 
 
 
  
  
 
   
 
    
  A vibration effect based on jQuery 
 
   
 
   
 
    
 Use the overflow attribute of css to change the thumbnail size. 
 
   
 
  
 
 

We can see from the above that there is an extra span tag, and the alt value in it is the value we need. Use the following jQuery code to obtain:

$ (Document ). ready (function () {$ ("# btnShow "). click (function () {var valuelist = ""; // Save the checkbox selected value // traverse the checkbox $ ("input [name ^ = 'listtest']") whose name starts with listTest. each (function () {if (this. checked) {// $ (this): The current checkbox object; // $ (this ). parent ("span"): checkbox parent span object valuelist + = $ (this ). parent ("span "). attr ("alt") + "," ;}}); if (valuelist. length> 0) {// obtain the sequence of the selected checkbox values. The result is 400,398 valuelist = valuelist. substring (0, valuelist. length-1 );}});});

The above is the method for jQuery to get the value of checkboxlist. I don't know if you really understand it. I hope this article will help you.