js前端操作checkbox赋值与取值

js 专栏收录该内容
1 篇文章 0 订阅

1. 获取到页面的元素往chackbox赋值

2. 遍历页面checkbox所有值拼成一个字符串。

上代码:


<script LANGUAGE="JavaScript">
    $(document).ready(function () {
        $.ajax({
            url: '/app/certpolicy.json',
            async: false,
            dataType: "json",
            success: function (result) {
                //result是一个集合,所以需要先遍历,获取前端json数据,动态添加checkbox
                $.each(result,function(index,obj){
                    $("#mycheckbox").append("<input name='value(POLICY)' type='checkbox' value="+
                        obj['policyId']+">"+obj['policyName']+"</input>");

                });
            }
        });
        //从页面隐藏属性拿值,赋给页面的checkbox
        var issuepolicy = getObj("value(ISSUEPOLICY)").value;
        if(issuepolicy != "undefined" && issuepolicy != null && issuepolicy != ""){
            var policy = issuepolicy.split(",");
            for(var i=0;i<policy.length;i++){
                $("input[name='value(POLICY)']").each(function(){
                    if($(this).val()==policy[i]){
                        $(this).attr("checked","checked");
                    }
                })
            }
        }
    });

</script>

<html:form action="/Save.do" onsubmit="return adjustForm();">

    <html:hidden property="value(ISSUEPOLICY)"/>
    
        <forms:description label="策略分配">
            <span id="mycheckbox"></span>
        </forms:description>

        <forms:description>
            <input type="submit" name="btnUpdate" value=" 保存 "/>
        </forms:description>

    </forms:form>

</html:form>

<script LANGUAGE="JavaScript">


    // var heartbeat = getObj("value(HEARTBEAT)");
    // if (heartbeat == 1 || heartbeat == "1"){
    //     getObj("value(HEARTBEAT_STATUS)").value = "正常运行";
    // } else {
    //     getObj("value(HEARTBEAT_STATUS)").value = "停止运行";
    // }

    function adjustForm() {

        var issuepolicy = "";
        //获取页面的checkbox复选框所有值,拼接成一个参数
        $("input[name='value(POLICY)']:checked").each(function(i){
            if(0==i){
                issuepolicy = $(this).val();
            }else{
                issuepolicy += (","+$(this).val());
            }

        });
        //alert(issuepolicy);
        getObj("value(ISSUEPOLICY)").value = issuepolicy;

        return true;
    }
</script>

 

window.onload和$(document).ready(function(){})的区别

1、执行时间上的区别:window.onload必须等到页面内(包括图片的)所有元素加载到浏览器中后才能执行。而$(document).ready(function(){})是DOM结构加载完毕后就会执行。

2、编写个数不同:window.onload不能同时写多个,如果有多个window.onload,则只有最后一个会执行,它会把前面的都覆盖掉。$(document).ready(function(){})则不同,它可以编写多个,并且每一个都会执行。

3、简写方法:window.onload没有简写的方法,$(document).ready(function(){})可以简写为$(function(){})。

另外:由于在$(document).ready()方法内注册的事件,只要DOM就绪就会被执行,因此可能此时元素的关联文件未下载完,例如与图片有关的HTML下载完毕,并且已经解析为DOM树了,但很有可能图片还未加载完毕,所以例如图片的高度和宽度这样的属性此时不一定有效。

  • 1
    点赞
  • 0
    评论
  • 2
    收藏
  • 打赏
    打赏
  • 扫一扫,分享海报

©️2022 CSDN 皮肤主题:大白 设计师:CSDN官方博客 返回首页

打赏作者

sijihereshui

你的鼓励将是我创作的最大动力

¥2 ¥4 ¥6 ¥10 ¥20
输入1-500的整数
余额支付 (余额:-- )
扫码支付
扫码支付:¥2
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值