复选框相关操作

效果图：

js代码：

第一步：请求数据

$.ajax({
                type: ‘get‘,
                async:false,
                url: "../../Ashx/GetMeeting.ashx?time="+new Date(),
                //data: { pageSize: Pagination.pageSize, pageIndex: Pagination.pageIndex },
                success: function (result) {
                    var data = JSON.parse(result);//eval("(" + result + ")");
                    //需要会签渲染
                    templateMng.renderCountersign($("#Xyhq"), data.Xyhq);

                }
            })

var templateMng = {
            Countersign_tpl: document.getElementById(‘Countersign_tpl‘).innerHTML,
            renderCountersign: function (contain, data) {//需要会签
                var list = { list: data };
                var html = juicer(templateMng.Countersign_tpl, list);
                contain.html(html);
            }
        }

　　生成的html:

<table class="font04" border="0">
        <tbody id="Xyhq">
            <tr>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="1a9d1026-8f0b-4840-a260-dec90296e442" type="checkbox" name="1a9d1026-8f0b-4840-a260-dec90296e442">
                    <label for="1a9d1026-8f0b-4840-a260-dec90296e442">古学进</label>
                </td>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="f148def4-a6c1-4b86-8174-866af9599341" type="checkbox" name="f148def4-a6c1-4b86-8174-866af9599341">
                    <label for="f148def4-a6c1-4b86-8174-866af9599341">赵彤</label>
                </td>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="d471cbc1-cf50-498a-be8a-9bc26d14b248" type="checkbox" name="d471cbc1-cf50-498a-be8a-9bc26d14b248">
                    <label for="d471cbc1-cf50-498a-be8a-9bc26d14b248">刘顺春</label>
                </td>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="6f08a457-9efb-402e-b521-edaed55c6e0d" type="checkbox" name="6f08a457-9efb-402e-b521-edaed55c6e0d">
                    <label for="6f08a457-9efb-402e-b521-edaed55c6e0d">杨桦</label>
                </td>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="4c41c463-961f-4af0-976b-6371eb10ea17" value="4c41c463-961f-4af0-976b-6371eb10ea17" type="checkbox" name="4c41c463-961f-4af0-976b-6371eb10ea17">
                    <label for="4c41c463-961f-4af0-976b-6371eb10ea17">任勇</label>
                </td>
            </tr>
            <tr>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="da203cd1-a0c9-43ac-8f5c-a42aed375d48" type="checkbox" name="da203cd1-a0c9-43ac-8f5c-a42aed375d48">
                    <label for="da203cd1-a0c9-43ac-8f5c-a42aed375d48">彭双伟</label>
                </td>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="895f89fa-8928-4ee0-8fee-c4318820fe80" type="checkbox" name="895f89fa-8928-4ee0-8fee-c4318820fe80">
                    <label for="895f89fa-8928-4ee0-8fee-c4318820fe80">卢山</label>
                </td>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="39d5e514-5a6a-44c8-81f2-26bfefe2cde9" type="checkbox" name="39d5e514-5a6a-44c8-81f2-26bfefe2cde9">
                    <label for="39d5e514-5a6a-44c8-81f2-26bfefe2cde9">寇廷佳</label>
                </td>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="792010eb-fcd3-4949-8f97-67e4be5a6143" type="checkbox" name="792010eb-fcd3-4949-8f97-67e4be5a6143">
                    <label for="792010eb-fcd3-4949-8f97-67e4be5a6143">詹峰</label>
                </td>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="1cb282b7-75e0-404e-8835-032fe7a2b5d4" value="1cb282b7-75e0-404e-8835-032fe7a2b5d4" type="checkbox" name="1cb282b7-75e0-404e-8835-032fe7a2b5d4">
                    <label for="1cb282b7-75e0-404e-8835-032fe7a2b5d4">李先奇</label>
                </td>
            </tr>
            <tr>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="31d9d993-afd0-4e40-a6e9-493a0a0673a3" type="checkbox" name="31d9d993-afd0-4e40-a6e9-493a0a0673a3">
                    <label for="31d9d993-afd0-4e40-a6e9-493a0a0673a3">王冬梅</label>

                </td>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="115a386f-83e0-4d7d-a928-84543bc2fc31" type="checkbox" name="115a386f-83e0-4d7d-a928-84543bc2fc31">
                    <label for="115a386f-83e0-4d7d-a928-84543bc2fc31">高允升</label>
                </td>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="352ea90d-0d96-49d0-b17c-0e034bc6803e" type="checkbox" name="352ea90d-0d96-49d0-b17c-0e034bc6803e">
                    <label for="352ea90d-0d96-49d0-b17c-0e034bc6803e">冉卫东</label>
                </td>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="df24438c-dc5f-4bbe-9166-cf88265de067" type="checkbox" name="df24438c-dc5f-4bbe-9166-cf88265de067">
                    <label for="df24438c-dc5f-4bbe-9166-cf88265de067">靖小伟</label>
                </td>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="497f9340-518a-4d32-a2ab-01f97ff3ee6a" value="497f9340-518a-4d32-a2ab-01f97ff3ee6a" type="checkbox" name="497f9340-518a-4d32-a2ab-01f97ff3ee6a">
                    <label for="497f9340-518a-4d32-a2ab-01f97ff3ee6a">王文革</label>
                </td>
            </tr>
            <tr>
                <td style="background-color: rgb(241, 245, 250);">
                    <input id="b64a4ea9-972e-4252-bb79-62bd35d62d57" type="checkbox" name="b64a4ea9-972e-4252-bb79-62bd35d62d57">
                    <label for="b64a4ea9-972e-4252-bb79-62bd35d62d57">系统管理员</label>
                </td>
            </tr>
        </tbody>
    </table>

　　相关操作：

$("#CheckBox_Countersign").attr("checked", true); 设置为选中状态
$("#CheckBox_Countersign").attr("checked", false); 设置为未选中状态
$("#CheckBox_Countersign").attr("checked") != false 判断选中状态：选中
$("#CheckBox_Countersign").attr("checked") == false 判断选中状态：未选中

<input id="CheckBox_Countersign" value="123" type="checkbox" name="123">

var checkedInput = $("#Xyhq input[type=‘checkbox‘]:checked"); 获取所有选中的复选框

原文地址：https://www.cnblogs.com/liuqiyun/p/8889588.html