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;
 }
}
作者最新文章