【转载】jquery实现勾选复选框触发事件给input赋值+回显复选框
引用:https://blog.csdn.net/rui276933335/article/details/45717461
JSP:
<td class="as1"> <input type="checkbox" name="gdzc" value="1" class="az"/><label for="t0" class="as">商品房</label> <input type="checkbox" name="gdzc" value="2" class="az"/><label for="t1" class="as">土地</label> <input type="checkbox" name="gdzc" value="3" class="az"/><label for="t2" class="as">厂房</label> <input type="checkbox" name="gdzc" value="4" class="az"/><label for="t3" class="as">企业产</label> <input type="checkbox" name="gdzc" value="5" class="az"/><label for="t4" class="as">底商</label> <input type="checkbox" name="gdzc" value="6" class="az"/><label for="t5" class="as">别墅</label> <input type="checkbox" name="gdzc" value="7" class="az"/><label for="t6" class="as">写字楼</label> <input class="txtValue" type="hidden" type="text" 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); } }) } }