【转载】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中点击行和点击复选框触发的事件是不一样的! 点 ...
随机推荐
- delphi之socket通讯
使用了2个组建: TServerSocket TClientSocket ------------------TServerSocket--------------------------- //开启 ...
- java自增(自减)运算符
自增(自减)运算符: ++ --就是可以将当前变量自我增加(减少)1 的运算符. i++, 后++, 先将 i 的值作为整个表达的值, 然后将 i 增加 1. ++i, 先++, 先将 i 增加 ...
- CSS media query应用中的层叠特性使用最佳实践
media query是css3规范中引入的,它提供了一种responsive design的基础机制:浏览器在不同size的设备中将以不同样式展现网页,这就给一个网页能够适应不同device一种可能 ...
- phantomjs rendering
http://wwwy3y3.ghost.io/pageres-phantomjs-capture-sreenshot-chinese-fonts-not-render-correctly/ 在使用中 ...
- Log4j的配置文件
附:Log4j比较全面的配置 Log4j配置文件实现了输出到控制台.文件.回滚文件.发送日志邮件.输出到数据库日志表.自定义标签等全套功能. log4j.rootLogger=DEBUG,consol ...
- 设计模式:外观(Facade)模式
设计模式:外观(Facade)模式 一.前言 外观模式是一种非常简单的模式,简单到我们经常都会使用,比如对于类A和B,如果两者需要交互,经过一定的处理过程才能实现某一个具体的功能,那么我们可以将这 ...
- create-react-app部署到GitHub Pages时报错:Failed to get remote。origin.url
最近使用create-react-app脚手架开发了一个私人博客:点击跳转,在部署到GitHub Pages的时候报了一个错误,具体如下: 在create-react-app的GitHub库的issu ...
- 支持FreeMarker需要哪些JAR包?
FreeMarker所需的全部jar包,Jar包:struts2-core-2.0.11.2.jar,xwork-2.0.5.jar,ognl-2.6.11.jar,freemarker-2.3.8. ...
- 输出预测边界框,NMS非极大值抑制
我们预测阶段时: 生成多个锚框 每个锚框预测类别和偏移量 但是,当同一个目标上可能输出较多的相似的预测边界框.我们可以移除相似的预测边界框.——NMS(非极大值抑制). 对于一个预测边界框B,模型会计 ...
- Linux学习总结(十四) 文件的打包和压缩
文件的压缩和打包,在windos下我们很熟悉.rar和.zip文件,这是两种压缩文件,他们支持单个文件和多个文件的压缩.windos下我们不提及打包的概念,虽然多个文件的压缩肯定存在打包过程.打包和压 ...