js 实现一个按钮控制表格中所有按钮

1、需要实现的效果：

单选框选中点击 应用全部 按钮之后，表格里面所有的 只读 按钮全部选中

代码
说明：此效果实现基于 layui 模板，原生JS 实现原理同此.

HTML：

	<input type="radio" name="allEdit" value="可编辑" title="可编辑" checked="">
    <input type="radio" name="allEdit" value="只读" title="只读">
    <input type="radio" name="allEdit" value="隐藏" title="隐藏">
	<input type="button" class="layui-btn layui-btn-sm" id="applyAll" value="应用全部">

模板加载表格中的单选按钮：
说明：在 layui 中，form 标签必须，否则在 应用全部 的时候出现 bug

<script id="operationForm" type="text/html">
    <form action="">
        <input type="radio" name="edit{{d.columnName}}" value="可编辑" title="可编辑" checked="">
        <input type="radio" name="edit{{d.columnName}}" value="只读" title="只读">
        <input type="radio" name="edit{{d.columnName}}" value="隐藏" title="隐藏">
    </form>
</script>

JS

	$("#applyAll").click(function () {
            var val=$('input:radio[name="allEdit"]:checked').val();   // 获取点击的radio
            $("input:radio[name^=\"edit\"]").each(function(){       // 遍历以 name 为 edit 开头的 radio 元素(自己起名)
                if($(this).val() == val){
                    $(this).prop( "checked", true);                       //  给 this 添加 true 属性
                    form.render("radio");									// 更新渲染  form 表单的 radio
                }
            });
        });

另：
在给 获取到的 radio 添加 checked 属性的时候要用 prop,不能用 checked。
1、prop 对于HTML元素本身就带有的固有属性如 href、target、class、checked、select ；
2、attr 对于HTML元素我们自定义的加在标签中的属性如给标签新加属性deparedId、inputId等自己起名的属性