js前端操作checkbox赋值与取值

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树了，但很有可能图片还未加载完毕，所以例如图片的高度和宽度这样的属性此时不一定有效。