jsp前端文件中: <tr> <td align="right" width="50%">其他账户:</td> <td align="left"><p id="userName">${userName}</p></td> </tr> <tr> <td align="right" valign="top" width="50%" style="padding-top:20px;">账户列表:</td> <td align="left" valign="top"> <c:forEach items="${accounts}" var="account"> <p><input type="checkbox" name="businessId" value="${account.id}" data="${account.name }" <c:if test="${account.state=='0'}">checked="checked" disabled="disabled"</c:if>/>${account.name }</p> </c:forEach > </td> </tr> input中每个属性:type="checkbox" 表示input类型为复选框 即可选择,可取消选择; name="businessId" form表单提交时根据这个属性 data="${account.name }表示该复选框的值; checked="checked"表示对这个选择框进行了选择; disabled="disabled"表示不可进行选择和取消选择操作
js中处理: $('#confirm').click(function(){ //选中的账户id集合,用逗号分隔 var businessIds=""; //选中的账户名集合,用顿号分隔 var businessNames=""; var userName=$('#userName').html(); $("input[name='businessId']:checkbox").each(function(){ if ($(this).get(0).checked && $(this).attr("disabled")!="disabled") { alert(this) businessIds += $(this).attr('value')+','; alert(businessIds); businessNames+=$(this).attr("data")+"、"; alert(businessNames); } }); businessIds=businessIds==""?businessIds:businessIds.substr(0,businessIds.length-1); businessNames=businessNames==""?businessNames:businessNames.substr(0,businessNames.length-1); $('#businessIds').val(businessIds); if(businessIds==""){ $.messager.alert("提示","请选择需要添加的账户"); return; }
有关input按钮中checkbox的复选提交前端处理学习总结
最新推荐文章于 2024-01-28 20:23:56 发布