后台返回数据回显，使用js控制默认选中复选框和下拉框
Posted jackduan1
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了后台返回数据回显，使用js控制默认选中复选框和下拉框相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>测试</title>
<?php
$chk = array(‘ch1‘,‘ch3‘,‘ch5‘); //后台获取checkbox选中id的数组
$slt = ‘iph‘; //后台获取select选中option的value
?>
<script type="text/javascript" src="//upcdn.b0.upaiyun.com/libs/jquery/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function(){
var chkData = <?php echo json_encode($chk);?>;
var sltData = ‘<?php echo $slt;?>‘;
$(‘.chk‘).each(function(){
var self = $(this);
var selfId = self.attr(‘id‘);
$.each(chkData, function(n, v){
if(v == selfId) self.attr(‘checked‘ , ‘true‘);
});
});
$(‘#select option‘).each(function(){
var self = $(this);
var selfVal = self.val();
if(selfVal == sltData) self.attr(‘selected‘ , ‘true‘);
});
});
</script>
</head>
<body>
<p><input id="ch1" class="chk" type="checkbox" value="111">111</p>
<p><input id="ch2" class="chk" type="checkbox" value="222">222</p>
<p><input id="ch3" class="chk" type="checkbox" value="333">333</p>
<p><input id="ch4" class="chk" type="checkbox" value="444">444</p>
<p><input id="ch5" class="chk" type="checkbox" value="555">555</p>
<div class="selectAera">
<select id="select">
<option value="smt">锤子</option>
<option value="iph">苹果</option>
<option value="xm">小米</option>
<option value="nka">诺基亚</option>
</select>
</div>
</body>
</html>以上是关于后台返回数据回显，使用js控制默认选中复选框和下拉框的主要内容，如果未能解决你的问题，请参考以下文章