页面上动态加载内容（checkbox框），选中取消事件

最新推荐文章于 2022-06-25 22:13:00 发布

zk_Kang

最新推荐文章于 2022-06-25 22:13:00 发布

阅读量6.4k

点赞数

CC 4.0 BY-SA版权

分类专栏： web前端文章标签： checkbox

本文链接：https://blog.youkuaiyun.com/zhang_kang_user/article/details/77479126

web前端专栏收录该内容

17 篇文章

订阅专栏

本文介绍了一种使用JavaScript动态生成并加载复选框的方法，并实现了选中与取消选中的事件处理逻辑。通过解析JSON数据，自动生成带有特定值和标签的复选框，同时根据用户操作触发相应的事件。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

动态加载checkbox之后，选中，取消事件，

    //动态加载的checkbox内容
    var dataObj = $.parseJSON(datas).CGYY;//datas为查找出来要显示的checkbox内容
    var htmld='';
    for(var i=0;i<dataObj.length;i++){
        htmld += '<input type="checkbox" name="CGYY" value='+dataObj[i].JLBH+'  onchange="javascript:toEditRe(this)"  /><span>'+dataObj[i].YY+'</span><br>';
    }
    document.getElementById("hdivid").innerHTML=htmld;//hdivid为显示地方的div的id

//要显示checkbox内容的div
<div  class="Select_Round" id="hdivid" style="height: auto; width: auto;"></div>

//当点击选中之后，就等于为onchange，调用其方法
function toEditRe(obj){

        if($(obj).prop("checked")){//选中操作
            if($(obj).val()==99){
                $("#JXFBZId").removeAttr("disabled");
            }
        }else{//取消选中操作
            $("#JXFBZId").attr("disabled","disabled");
        }
    }