【转载】jquery实现勾选复选框触发事件给input赋值+回显复选框
引用:https://blog.csdn.net/rui276933335/article/details/45717461
JSP:
<td class="as1">
<input type="checkbox" name="gdzc" value="1" id="t0" class="az"/><label for="t0" class="as">商品房</label>
<input type="checkbox" name="gdzc" value="2" id="t1" class="az"/><label for="t1" class="as">土地</label>
<input type="checkbox" name="gdzc" value="3" id="t2" class="az"/><label for="t2" class="as">厂房</label>
<input type="checkbox" name="gdzc" value="4" id="t3" class="az"/><label for="t3" class="as">企业产</label>
<input type="checkbox" name="gdzc" value="5" id="t4" class="az"/><label for="t4" class="as">底商</label>
<input type="checkbox" name="gdzc" value="6" id="t5" class="az"/><label for="t5" class="as">别墅</label>
<input type="checkbox" name="gdzc" value="7" id="t6" class="az"/><label for="t6" class="as">写字楼</label>
<input class="txtValue" type="hidden" type="text" id="qwer" name="com_fixed_assets" value="${application.com_fixed_assets}" />
</td>
JS复选框:
$(function(){
var count = 0;
$(".as1 :checkbox").click(function(){
var txtvalue = $(this).val();
if ($(".txtValue").val() == ""){
if ($(this).prop("checked") == true){
var txtalso = $.trim(txtvalue);
} else {
var txtalso = "";
}
}else {
if ($(this).prop("checked") == true){
var txtalso = $.trim($(".txtValue").val()) + "," + $.trim(txtvalue);
}
else {
var txtelse = $.trim($(".txtValue").val());
var txtnow = $.trim(txtvalue);
var reg1 = "," + txtnow;
var reg2 = txtnow + ",";
var reg3 = txtnow;
var txtelse = txtelse.replace(reg1, "").replace(reg2, "").replace(reg3, "");
var txtalso = txtelse;
}
}
$(".txtValue").val(txtalso);
count++;
});
});
JS回显:
$(function(){
//当页面加载完成的时候,自动调用该方法
window.onload=function(){
//获得所要回显的值
var checkeds = $("#qwer").val();
//拆分为字符串数组
var checkArray =checkeds.split(",");
//获得所有的复选框对象
var checkBoxAll = $("input[name='gdzc']");
//获得所有复选框的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).prop("checked",true);
}
})
}
}
【转载】jquery实现勾选复选框触发事件给input赋值+回显复选框的更多相关文章
- jquery点击复选框触发事件给input赋值
体验效果:http://keleyi.com/keleyi/phtml/jqtexiao/31.htm 代码如下: <!DOCTYPE html> <html xmlns=" ...
- thymeleaf单选回显,多选回显,选回显,下拉默认选中第一个
//默认选中第一个<input type ="radio" name="repaymentType" th:each ="repaymentTy ...
- EasyUI加zTree使用解析 easyui修改操作的表单回显方法 验证框提交表单前验证 datagrid的load方法
带参提交一次查询,从服务器加载新数据.这是一个神奇的方法 $('#dg').datagrid('load',{ code: '01', name: 'name01' }); easyui修改操作的回显 ...
- jquery接收后台数组或集合回显复选框
公司使用的框架比较旧,没有使用el等表达式.如果后台传递的是数组,需要把数组转为以逗号分隔的字符串. <% String context = request.getContextPath(); ...
- jquery点击div以外的区域触发事件
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- 关于select下拉框选择触发事件
最开始使用onclick设置下拉框触发事件发现会有一些问题: <select> <option value="0" onclick="func0()&q ...
- jquery复选框 选中事件 及其判断是否被选中
jquery复选框 选中事件 及其判断是否被选中 (2014-07-25 14:03:54) 转载▼ 标签: jquery复选框选中事件 分类: extjs jquery 今天做了 显示和不显示密 ...
- Thymeleaf+layui+jquery复选框回显
一.Thymeleaf+layui+jquery复选框回显 基于Thymeleaf模板下的layui+jquery复选框回显,主要是jquery.大致意思是:把数组转成JSON传到前台,再在前台转回数 ...
- easyui 复选框 onClickRow事件与onSelect事件与onCheck事件
在项目中一直存在一个问题,一直都没发现问题的根源在哪里.在我们测试这边也是偶尔会出现.但是每次我去测试的时候也没问题.今天终于找到原因了! 在easyui中点击行和点击复选框触发的事件是不一样的! 点 ...
随机推荐
- [英中双语] Pragmatic Software Development Tips 务实的软件开发提示
Pragmatic Software Development Tips务实的软件开发提示 Care About Your Craft Why spend your life developing so ...
- sql server——分组查询(方法和思想)
思想 先排序在汇总 sql server里分组查询通常用于配合聚合函数,达到分类汇总统计的信息.而其分类汇总的本质实际上就是先将信息排序,排序后相同类别的信息会聚在一起,然后通过需求进行统计计算. 使 ...
- Linux账号管理和ACL
by zjmyster version :1.2 Linux账号管理和ACL权限设置: 主要相关配置文件:/etc/passwd /etc/shadow /etc/group /etc/gshadow ...
- vmware虚拟机添加新硬盘
1 vmware中添加硬盘 2 重启虚拟机后,fdisk -l 查看已经挂在好的硬盘,比如/dev/sdb3 mkfs.ext3 /dev/sdb4 挂在: mount /de ...
- 1100 final standings
http://acm.timus.ru/problem.aspx?space=1&num=1100 link to the problem make a fast stable sorting ...
- 023re模块(正则)
之前我刚学的python知识点,没有题目进行熟悉,后面的知识点会有练习题,并且慢慢补充.看到很多都是很简单的练习,碰到复杂.需要运用的再补充吧#字符串中使用到正则表达式 s='hello world' ...
- 管理kafka
一.主题操作使用kafka-topics.sh工具可以执行主题的大部分操作(配置变更部分已被启用并被移动到kafka-configs.sh工具中).我们可以用它创建.修改.删除和查看集群里的主题,要使 ...
- 当你的Spring IOC 容器(即applicationContext.xml文件)忘记配到web.xml 文件中时
当你的Spring IOC 容器忘记配到web.xml 文件中时,启动服务器就会报错. 部分错误如下: Caused by: org.springframework.beans.factory.NoS ...
- StringUtils工具类介绍
1 abbreviate方法缩写一段文字 StringUtils.abbreviate("abcdefghijklmno", -1, 10) = "abcdefg...& ...
- Pollard_rho 因数分解
Int64以内Rabin-Miller强伪素数测试和Pollard 因数分解的算法实现 选取随机数\(a\) 随机数\(b\),检查\(gcd(a - b, n)\)是否大于1,若大于1则\(a - ...