用JS（JavaScript）来进行对Struts的Html:checkbox或者html:multibox进行全选、及其他控制

本文链接：https://blog.csdn.net/hardycheng/article/details/4664751

最近在开发项目的时候，要求实现对地市的权限选择，使用checkbox进行实现。

于是在网上先找了一下关于Struts对于html:checkbox进行的各种控制，可是很失望，网上说的无非都是
使用各种隐藏域来进行赋值或者控制的，而且在使用js对checkbox的状态判断的时候，采用的方法都很麻烦，这里就不一一列举了。

进入正题;

开始的时候发现html:checkbox下没有checked属性，当然对于它的name和id属性还是由于已经发生实质意义上的转变而不能采用getElementById来进行获取。所以一度陷入低谷。

在网上找来找去也没找到满意答案。于是还是自己动手亲自来操作。

静下来仔细一想，发现其实不管jsp页面是由Struts标签来写还是有JSTL来写，最后都是先要生成一个html页面。所以这样就好办了，因为我们的 “全选” 和 “全不选” 都是在html页面生成之后才进行控制的，所以这个时候只要关心已生成的HTML页面中存在的标签并对其进行控制即可。

所以可以用下面的方法进行html:checkbox或者html:multibox的全选控制：
-----------------------------------------------

jsp部分代码：

<input type="checkbox" name="checkall" οnclick="checkAll();" value="checkall">全选<br>

<logic:iterate id="city" name="citylist">
    <html:multibox   property="Area" ><bean:write name="city" property="cityID"/></html:multibox><bean:write name="city" property="cityName"/>

</logic:iterate>
-----------------------------------------------
其中
citylist从action中获取：

对应action代码：
List<City> citylist = 从数据获取所有的城市并封装成一个list。
request.setAttribute ("citylist ",citylist );
-----------------------------------------------
对应City类应该包含：
private String cityName；
private String cityID;
已经对应的get、set方法。
-----------------------------------------------
JS

function checkAll(){
    //全选
    var flag;
    var area = document.getElementsByName("Area");
    var len = area.length;

    var chall = document.getElementsByName("checkall")[0];

    if(chall.checked == true){

        for(i=0;i<len;i++){
            area[i].checked = "checked";
        }
    }

    if(chall.checked != true){
        for(i=0;i<len;i++){
            area[i].checked = "";
        }
    }

}

因为这个时候已经存在一个完整的html页面，而
<html:multibox   property="Area" ><bean:write name="city" property="cityID"/></html:multibox>
生成的代码为：
<input type="checkbox" name="Area" value="ln" checked="checked">辽宁

    <input type="checkbox" name="Area" value="ln/sy" checked="checked">沈阳

    <input type="checkbox" name="Area" value="ln/dl" checked="checked">大连

    ………………

所以可以使用
var area = document.getElementsByName("Area");
来获取到checkbox的对象组，
然后采用循环进行check的设置。

注意的是 document.getElementsByName("Area"); 如果获取的是checkbox，此时返回的是一个object【】；
所以在取全选 checkbox的checked的值的时候应该使用：
var chall = document.getElementsByName("checkall")[0];
才能获取到全选checkbox对象，然后再通过 chall 。checked 来判断是否要进行全选或者全不选。