获取CheckBoxList的选中的值

   asp.net服务器控件CheckBoxList在生成html代码后并没有像radio之类的有个value属性，如果想在客户端中通过Js获取选中的值有点困难，而且生成的html后，id又不好获取。
  今天正好也遇见了这个问题，后面研究了下，总算找到个还可以实习的方法，俺就先不说效率或者使用起来怎么样，但至少是满足了俺的要求。现在贴上代码，共享下，也给自己留份备份，嘿嘿。
  思路是这样的：
  CheckBoxList生成html后，会有一个span，span里面有input和label节点，都是成对出现的。例如：


  <span id="ctl00_cphMain_ckblZjcl"><input id="ctl00_cphMain_ckblZjcl_0" type="checkbox" name="ctl00$cphMain$ckblZjcl$0" /><label for="ctl00_cphMain_ckblZjcl_0">A1</label><input id="ctl00_cphMain_ckblZjcl_1" type="checkbox" name="ctl00$cphMain$ckblZjcl$1" /><label for="ctl00_cphMain_ckblZjcl_1">A2</label><input id="ctl00_cphMain_ckblZjcl_2" type="checkbox" name="ctl00$cphMain$ckblZjcl$2" /><label for="ctl00_cphMain_ckblZjcl_2">A3</label><input id="ctl00_cphMain_ckblZjcl_3" type="checkbox" name="ctl00$cphMain$ckblZjcl$3" /><label for="ctl00_cphMain_ckblZjcl_3">B1</label><input id="ctl00_cphMain_ckblZjcl_4" type="checkbox" name="ctl00$cphMain$ckblZjcl$4" /><label for="ctl00_cphMain_ckblZjcl_4">B2</label><input id="ctl00_cphMain_ckblZjcl_5" type="checkbox" name="ctl00$cphMain$ckblZjcl$5" /><label for="ctl00_cphMain_ckblZjcl_5">C1</label><input id="ctl00_cphMain_ckblZjcl_6" type="checkbox" name="ctl00$cphMain$ckblZjcl$6" /><label for="ctl00_cphMain_ckblZjcl_6">C2</label><input id="ctl00_cphMain_ckblZjcl_7" type="checkbox" name="ctl00$cphMain$ckblZjcl$7" /><label for="ctl00_cphMain_ckblZjcl_7">C3</label><br /><input id="ctl00_cphMain_ckblZjcl_8" type="checkbox" name="ctl00$cphMain$ckblZjcl$8" /><label for="ctl00_cphMain_ckblZjcl_8">C4</label><input id="ctl00_cphMain_ckblZjcl_9" type="checkbox" name="ctl00$cphMain$ckblZjcl$9" /><label for="ctl00_cphMain_ckblZjcl_9">D</label><input id="ctl00_cphMain_ckblZjcl_10" type="checkbox" name="ctl00$cphMain$ckblZjcl$10" /><label for="ctl00_cphMain_ckblZjcl_10">E</label><input id="ctl00_cphMain_ckblZjcl_11" type="checkbox" name="ctl00$cphMain$ckblZjcl$11" /><label for="ctl00_cphMain_ckblZjcl_11">F</label><input id="ctl00_cphMain_ckblZjcl_12" type="checkbox" name="ctl00$cphMain$ckblZjcl$12" /><label for="ctl00_cphMain_ckblZjcl_12">M</label><input id="ctl00_cphMain_ckblZjcl_13" type="checkbox" name="ctl00$cphMain$ckblZjcl$13" /><label for="ctl00_cphMain_ckblZjcl_13">N</label><input id="ctl00_cphMain_ckblZjcl_14" type="checkbox" name="ctl00$cphMain$ckblZjcl$14" /><label for="ctl00_cphMain_ckblZjcl_14">P</label><br /></span>

嘿嘿，懒的再去搞个试验的，直接项目中的代码贴上来有点乱。
 不过规律还是有的，<span><input .... /><label>TextValue</label>........{循环N次这样的input 和label} </span>

所以，在客户端中，可以通过获取span这个节点，然后通过获取他的input子节点和label子节点集。通过判断input的checked属性是不是true，然后通过查找具有相同索引的label，查出这个所对应的Label的Text就可以了。

发现表达语言真的不怎么样，可能说的不是很清楚，贴上代码先。

 ///获取CheckBoxList的选中的值
     function getCheckBoxListValue(parentSpanClientID)
     {
        var value='';
        var itemCount=$('input','#'+parentSpanClientID).length;
        var labItems=$('label','#'+parentSpanClientID);
        for(var i=0;i<itemCount;i++)
        {
           if($('#'+parentSpanClientID+'_'+i)[0].checked==true)
           {
               value=value+labItems[i].innerText+',';
           }
        }
        
        if(value.length>0)
        {
           return value.substr(0,value.length-1); //去掉最后一个,
        }
        else
        {
           return '';
        }
     }

以上的代码是基于Jquery的，$('#'+parentSpanClientID+'_'+i)[0]==document.getElementById

over...

[本日志由 随风 于 2008-07-16 02:01 PM 编辑]
文章来自: 本站原创
引用通告地址: http://www.fenglog.com/blog/trackback.asp?tbID=348
Tags: