为多个checkbox绑定单击事件
博客专区 > Jansens 的博客 > 博客详情
为多个checkbox绑定单击事件
Jansens 发表于1年前
为多个checkbox绑定单击事件
  • 发表于 1年前
  • 阅读 8
  • 收藏 0
  • 点赞 0
  • 评论 0

【腾讯云】买域名送云解析+SSL证书+建站!>>>   

当单击一个checkbox时触发一个方法,先判断其是否选中,然后执行相应的操作

/** **************** 选择框点击事件绑定 ************* */  

        function checkboxOnClick() {  

       var a=[];  

            $("input[type=checkbox]").click(function() {  

                    var checkbox_value = $(this).attr('value');  

                    if ($("#selectInfo" + checkbox_value).is(":checked")) {  

                        if(a[0]=='未选择'){  

                            a.splice(0,1);//splice() 方法用于插入、删除或替换数组的元素。  

                        }  

                        if(checkbox_value == "C\\+\\+")  

                            checkboxvalue="C++";  

                        if(checkboxvalue=='\\.Net')   

                            checkboxvalue='.Net';  

                        a.push(checkbox_value);  

                        dwr.util.setValue(tdid,a);//填充ID为tdid的表格行  

                    } else {  

                        if(checkbox_value == "C\\+\\+")  

                            checkboxvalue="C++";  

                        if(checkboxvalue=='\\.Net')   

                            checkboxvalue='.Net';  

                        //alert(checkbox_value);  

                        for(var i=0;i<a.length;i++){  

                            if(checkboxvalue==a[i]) break;  

                        }  

                        a.splice(i,1);//splice() 方法用于插入、删除或替换数组的元素。  

                        if(a==''){a.push('未选择');};  

                        dwr.util.setValue(tdid,a);//填充ID为tdid的表格行  

                    }  

            });  

        }  

  

页面加载时,加载此方法:

Js代码 

window.onload = function() {  

            checkboxOnClick();  

        };  

 或: 

Js代码 

jQuery(function() {  

            checkboxOnClick();  

        });  

 

其jsp页面代码

<html>  

  <head>  

    <title>DWR获取浏览器页面信息</title>  

  </head>  

  <body>  

    <table id="tableid" border="1" align="center">  

        <tr>  

            <td id="tdid"colspan="2" >修改此行值</td>  

        </tr>  

    </table>  

        <input type="checkbox" name="interest" id="selectInfoC" value="C" />C  

        <input type="checkbox" name="interest" id="selectInfoVB" value="VB" />VB  

        <input type="checkbox" name="interest" id="selectInfoVFoxpro" value="VFoxpro" />VFoxpo 

        <input type="checkbox" name="interest" id="selectInfoC++" value="C\+\+" />C++  

        <input type="checkbox" name="interest" id="selectInfoJava" value="Java" />Java  

        <input type="checkbox" name="interest" id="selectInfo.Net" value="\.Net" />.Net  

        <input type="checkbox" name="interest" id="selectInfoPHP" value="PHP" />PHP  

        <input type="checkbox" name="interest" id="selectInfoDelphi" value="Delphi" />Delphi  

  </body>  

</html>  

 

 

  • 打赏
  • 点赞
  • 收藏
  • 分享
共有 人打赏支持
粉丝 7
博文 53
码字总数 128340
×
Jansens
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: