JS获取后台字段并动态设置Checkbox选中状态
作者:异步漫步时间:2026-10-27 11:02:05浏览:459
本文介绍如何利用JavaScript和jQuery获取后台返回的字段值,并据此动态设置HTML中复选框(Checkbox)的选中状态。通过对比后台返回的标识符(如'Y'或特定数值),在前端初始化时自动勾选对应的总包人或分包人选项,实现数据与界面的同步。
前端HTML结构定义
具体实现代码如下所示:
<td width="15%" align="left">是否为分包人</td>
<td width="35%" align="left">
<INPUT TYPE="checkbox" NAME="fbr" id="fbr1">
<s:hidden name="fbr" id="fbr"></s:hidden>
</td>
<td width="15%" align="left">是否为总包人</td>
<td width="35%" align="left">
<INPUT TYPE="checkbox" NAME="zbr" id="zbr1">
<s:hidden name="zbr" id="zbr"></s:hidden>
</td>
后台数据返回逻辑zbr = ("Y".equals(String.valueOf(map.get("ylzd11"))))?"1":"0";////是否为总包人
fbr = ("Y".equals(String.valueOf(map.get("ylzd12"))))?"1":"0";//是否为分包人
return "jzysuccess";
JavaScript初始化与状态控制function init(){
//通用的付款方类型代码 1 代表为单位 0 代表为个人
if($("#fkfLxDm").val()=='1'){
$('input[type=radio][value=1]')[0].checked = true;
}else if ($("#fkfLxDm").val()=='0'){
$('input[type=radio][value=0]')[0].checked =true;
}
//是否为总包人
if($("#zbr").val()=='1'){
//<INPUT TYPE="checkbox" NAME="zbr" id="zbr1"> zbr 总包人的id 要准确 唯一
$("#zbr1")[0].value = true;
alert($("#zbr").val());
$('input[type=checkbox][value=true]')[0].checked =true;
alert($("#fbr").val());
}else {
$("#zbr1")[0].value = false;
$('input[type=checkbox][value=false]')[0].checked =false;
}
//建筑业是否为分包人
alert($("#fbr").val());
if($("#fbr").val()=='1'){
// <INPUT TYPE="checkbox" NAME="fbr" id="fbr1"> fbr 分包人 id 要准确 唯一
$("#fbr1")[0].value = true;
$('input[type=checkbox][value=true]')[1].checked =true;
}else {
$("#fbr1")[0].value = false;
$('input[type=checkbox][value=false]')[1].checked =false;
}
}作者最新文章
D3.js 比例尺与坐标轴的配置详解
2026-11-05 16:54:46
JavaScript怎么遍历对象的Symbol键和不可枚举属性
2026-11-05 13:13:39
封装一个健壮的JS字符串判空工具函数
2026-11-05 12:16:14
JavaScript合并数组的三种常用方法:concat、扩展运算符与push
2026-11-05 11:22:29
JavaScript立即执行函数(IIFE)是什么及基本语法
2026-11-05 10:51:19
