在jsp页面中,处理后台数据在复选框中回显问题
<tr>
<th>标签:</th>
<td>
<c:forEach items="${tagList}" var="one" varStatus="step">
<input name="s1" type="checkbox" value="${one.id}" ${fn:contains(tagids,one.id)?'checked':'' }/> ${one.tagName}
<c:if test="${step.count%5==0}">
<br/>
</c:if>
</c:forEach>
</td>
</tr>
选中t9,点击保存,然后进行查看时,标签1也选中。 展开
首先贴出代码片段,然后根据代码逐一说明
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!--引入 fn jstl支持-->
<%@ taglib prefix="fn" uri="
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<ul>
<!-- 开发环境一般这里是用forEach循环-->
<li>
<!-- if 语句用来判断当前复选框是否选中-->
<!-- fn:contains 用来负责逻辑判断-->
<input type="checkbox" name="licence" id ="licence_1" value="1"
<c:if test="${fn:contains(info.licence,'1')}">checked="checked"</if> />
<label for="licence_1">licence_1</label>
</li>
<li>
<!-- 第二个复选项的逻辑和第一个是一样的 -->
<input type="checkbox" name="licence" id ="licence_2" value="2"
<c:if test="${fn:contains(info.licence,'2')}">checked="checked"</if> />
<label for="licence_2">licence_2</label>
</li>
</ul>
</body>
</html>
假设复选框的name是licence,后台用info对象接收,那么回显的时候实际上就是判断info.licence是否包含当前复选项的值,这时候借助jstl fn组件中的函数contains来解决,contains用来判断参数1中是否包含字符串参数2,用法和java总的一样。这里要注意,为了能使用contains函数,需要在页头进行声明,参见代码片段第三行
关于contains的详细描述如下:
fn:contains(string, substring)
假如参数string中包含参数substring,返回true
例如:<c:if test="${fn:contains(name, searchString)}">
fn还有很多其他好用的函数
1、fn:containsIgnoreCase(string, substring)
假如参数string中包含参数substring(忽略大小写),返回true
2、 fn:endsWith(string, suffix)
假如参数 string 以参数suffix结尾,返回true
3、fn:escapeXml(string)
将有非凡意义的XML (和HTML)转换为对应的XML character entity code,并返回
4、fn:indexOf(string, substring)
返回参数substring在参数string中第一次出现的位置
5、fn:join(array, separator)
将一个给定的数组array用给定的间隔符separator串在一起,组成一个新的字符串并返回。
6、fn:length(item)
返回参数item中包含元素的数量。参数Item类型是数组、collection或者String。假如是String类型,返回值是String中的字符数。
7、fn:replace(string, before, after)
返回一个String对象。用参数after字符串替换参数string中所有出现参数before字符串的地方,并返回替换后的结果
8、fn:split(string, separator)
返回一个数组,以参数separator 为分割符分割参数string,分割后的每一部分就是数组的一个元素
9、fn:startsWith(string, prefix)
假如参数string以参数prefix开头,返回true
10、fn:substring(string, begin, end)
返回参数string部分字符串,从参数begin开始到参数end位置,包括end位置的字符
11、fn:substringAfter(string, substring)
返回参数substring在参数string中后面的那一部分字符串
12、fn:substringBefore(string, substring)
返回参数substring在参数string中前面的那一部分字符串
13、fn:toLowerCase(string)
将参数string所有的字符变为小写,并将其返回
14、fn:toUpperCase(string)
将参数string所有的字符变为大写,并将其返回
15、fn:trim(string)
去除参数string 首尾的空格,并将其返回
$(function(){
//当页面加载完成的时候,自动调用该方法
window.onload=function(){
//获得所要回显的值,此处为:100,1001,200,1400
var checkeds = $("#meidaHidden").val();
//拆分为字符串数组
var checkArray =checkeds.split(",");
//获得所有的复选框对象
var checkBoxAll = $("input[name='media']");
//获得所有复选框(新闻,微信,论坛,问答,博客,平媒)的value值,然后,用checkArray中的值和他们比较,如果有,则说明该复选框被选中
for(var i=0;i<checkArray.length;i++){
//获取所有复选框对象的value属性,然后,用checkArray[i]和他们匹配,如果有,则说明他应被选中
$.each(checkBoxAll,function(j,checkbox){
//获取复选框的value属性
var checkValue=$(checkbox).val();
if(checkArray[i]==checkValue){
$(checkbox).attr("checked",true);
}
})
}
//全选多选框的回显
var array=$("input[name='media']:checked").length;
//如果等于6,说明全部被选中,那么全选多选框也要被选中
//如果不等于6,说明全部都没选,那么全选的多选框也要被取消
if(array==6){
$("#checkAll").attr("checked",true);
}else{
$("#checkAll").attr("checked",false);
}
};
});
//获得所要回显的值,后台返回的list或者string,如果是string,split(",")转换为数组
var checkArray =values;
//获得所有的复选框对象
var checkBoxAll = $("input[name='media']");
//获得所有复选框的value值,然后,用checkArray中的值和他们比较,如果有,则说明该复选框被选中
for(var i=0;i<checkArray.length;i++){
//获取所有复选框对象的value属性,然后,用checkArray[i]和他们匹配,如果有,则说明他应被选中
$.each(checkBoxAll,function(j,checkbox){
//获取复选框的value属性
var checkValue=$(checkbox).val();
if(checkArray[i]==checkValue){
$(checkbox).attr("checked",true);
}
})
}
$("input[name='word']").each(function(){
for(数组循环){//复选框的值
if($(this).val()==你的值) {//匹配到这个checkbox就设置check
$(this).checked=true;
}
}
});
oて哗w{gynh╚lcⅷ◇cⅷ◇qk鼎