HTML页面中复选框的操作方法

作者:袖梨 2022-06-25

        

            

                

全选

                复选框全选示例

            

            

                

                

            

            

                

                

            

            

                

                

            

            

                

                

            

            

                

                

            

            

                

                

            

            

                

                

            

            

                

反选

                

            

        

        

                var vll = document.getElementById("all");

                var vlist=document.getElementsByClassName("list");

                var vopp=document.getElementById("opp");

                vll.onclick=function(){

                    for(var i=0;i

                        vlist[i].checked=vll.checked;

                    }

                }

                for( vari=0;i

                    vlist[i].onclick=function(){

                        if(this.checked==false){

                            vll.checked=false; 

                            }

                        else{

                            for(vari2=0;i2

                                if(vlist[i2].checked==false){

                                    break;

                                }

                                if(i2>=vlist.length-1){

                                    vll.checked=true;  

                                }

                            }

                        }

                    }  

                }

                vopp.onclick=function(){

                    for(var i=0;i

                    vlist[i].checked=!vlist[i].checked;

                        if(vlist[i].checked==false){

                            vll.checked=false;

                        }

                    }

                }

        

    

相关文章

精彩推荐