全选和反选,怎么写,两种方法~
来源:互联网 发布:网络女神瑞思 编辑:程序博客网 时间:2024/05/03 20:41
HTML:
<div class="pre_infoWrap"> <div class="pre_dateWrap bg"> <div class="pre_date">2017年9月</div> <div class="pre_oneInfoWrap"> <div class="pre_oneInfo"> <div class="pre_oneCheck"> <img src="img/borrowChecking.png" alt=""> </div> <div class="pre_oneWarp"> <div class="pre_oneWarpTop"> <div class="pre_oneMidText">待还<span>3000</span>元</div> <div class="pre_oneMidTip pre_oneMidTipRed">已逾期</div> <div class="pre_oneMidPic"><img src="img/returnRight.png" alt=""></div> </div> <div class="pre_oneWarpBottom"> <div>9-4 17:33:27</div> <div class="preBorrowTotal">借款 <span>3000.00</span>元</div> <p class="preBorrowWeek">剩余 <span>1</span> 期</p> </div> </div> </div> <div class="pre_oneInfo"> <div class="pre_oneCheck"> <img src="img/borrowCheck.png" alt=""> </div> <div class="pre_oneWarp"> <div class="pre_oneWarpTop"> <div class="pre_oneMidText">待还<span>3000</span>元</div> <div class="pre_oneMidTip pre_oneMidTipBlue">还款中</div> <div class="pre_oneMidPic"><img src="img/returnRight.png" alt=""></div> </div> <div class="pre_oneWarpBottom"> <div>9-4 17:33:27</div> <div class="preBorrowTotal">借款 <span>3000.00</span>元</div> <p class="preBorrowWeek">剩余 <span>1</span> 期</p> </div> </div> </div> <div class="pre_oneInfo"> <div class="pre_oneCheck"> <img src="img/borrowCheck.png" alt=""> </div> <div class="pre_oneWarp"> <div class="pre_oneWarpTop"> <div class="pre_oneMidText">待还<span>3000</span>元</div> <div class="pre_oneMidTip pre_oneMidTipBlue">已放款</div> <div class="pre_oneMidPic"><img src="img/returnRight.png" alt=""></div> </div> <div class="pre_oneWarpBottom"> <div>9-4 17:33:27</div> <div class="preBorrowTotal">借款 <span>3000.00</span>元</div> <p class="preBorrowWeek">剩余 <span>1</span> 期</p> </div> </div> </div> </div> </div> <div class="pre_dateWrap bg"> <div class="pre_date">2017年10月</div> <div class="pre_oneInfoWrap"> <div class="pre_oneInfo"> <div class="pre_oneCheck"> <img src="img/borrowNoCheck.png" alt=""> </div> <div class="pre_oneWarp"> <div class="pre_oneWarpTop"> <div class="pre_oneMidText">借款<span>3000</span>元</div> <div class="pre_oneMidTip pre_oneMidTipOrange">待放款</div> <div class="pre_oneMidPic"><img src="img/returnRight.png" alt=""></div> </div> <div class="pre_oneWarpBottom"> <div>10-4 17:33:27</div> <!-- <div class="preBorrowTotal">借款 <span>3000.00</span>元</div> <p class="preBorrowWeek">剩余 <span>1</span> 期</p> --> </div> </div> </div> <div class="pre_oneInfo"> <div class="pre_oneCheck"> <img src="img/borrowNoCheck.png" alt=""> </div> <div class="pre_oneWarp"> <div class="pre_oneWarpTop"> <div class="pre_oneMidText">待还<span>3000</span>元</div> <div class="pre_oneMidTip pre_oneMidTipGray">借款失败</div> <div class="pre_oneMidPic"><img src="img/returnRight.png" alt=""></div> </div> <div class="pre_oneWarpBottom"> <div>10-4 17:33:27</div> <!-- <div class="preBorrowTotal">借款 <span>3000.00</span>元</div> <p class="preBorrowWeek">剩余 <span>1</span> 期</p> --> </div> </div> </div> <div class="pre_oneInfo"> <div class="pre_oneCheck"> <img src="img/borrowNoCheck.png" alt=""> </div> <div class="pre_oneWarp"> <div class="pre_oneWarpTop"> <div class="pre_oneMidText">待还<span>3000</span>元</div> <div class="pre_oneMidTip pre_oneMidTipOrange">借款待审核</div> <div class="pre_oneMidPic"><img src="img/returnRight.png" alt=""></div> </div> <div class="pre_oneWarpBottom"> <div>10-4 17:33:27</div> <!-- <div class="preBorrowTotal">借款 <span>3000.00</span>元</div> <p class="preBorrowWeek">剩余 <span>1</span> 期</p> --> </div> </div> </div> </div> </div> </div> <div class="D_payfor"> <div class="D_checkSure"><img src="img/borrowCheck.png" alt="">全选</div> <ul class="D_checkSureNum"> <li class="D_selNum"> <div>已选<span class="or_num">1</span>笔, </div> <div>逾期罚金:<span >100</span>元</div> </li> <li class="D_selTotal">合计:<span>3100</span>元</li> </ul> <a class="goPay" href="javascript:void(0);">立即还款</a> </div>
第一种方法JS:
$(".pre_oneCheck>img").click(function(){ if($(this).attr("src")=="img/borrowChecking.png"){ $(this).attr("src","img/borrowCheck.png") var isCheckAll=1; $(".pre_oneCheck>img").each(function(){ if($(this).attr("src")=="img/borrowChecking.png"){ isCheckAll = 0; } }); if (isCheckAll == 1) { $(".D_checkSure>img").attr("src","img/borrowCheck.png") } }else if($(this).attr("src")=="img/borrowCheck.png"){ $(this).attr("src","img/borrowChecking.png"); $(".D_checkSure>img").attr("src","img/borrowChecking.png") }else{ $(this).attr("src","img/borrowNoCheck.png") } }); $(".D_checkSure>img").click(function(){ if($(this).attr("src")=="img/borrowCheck.png"){ $(this).attr("src","img/borrowChecking.png"); $(".pre_oneCheck>img").each(function(){ if($(this).attr("src")=="img/borrowNoCheck.png"){ return } if($(this).attr("src")=="img/borrowCheck.png"){ $(this).attr("src","img/borrowChecking.png"); } }); }else{ $(this).attr("src","img/borrowCheck.png"); $(".pre_oneCheck>img").each(function(){ if($(this).attr("src")=="img/borrowNoCheck.png"){ return } $(this).attr("src","img/borrowCheck.png"); }); } })
第二种方法:
HTML:
<s:if test='jsonObj.repayNum == jsonObj.finishRepayNum'> <div class="installTop2 bg"> <div><img src="${base}/resources/img/jiekuanhuanqing.png" alt=""></div> <p>本期<span>${jsonObj.repayNum }</span>笔分期借款已还清</p> </div> </s:if> <s:else> <div class="installTop bg"> <div class="installTopText"><span>${jsonObj.repaymentDate }</span>待还 | <span>${jsonObj.toRepayNum }</span>笔分期借款</div> <div class="installTopTextMid">¥<span>${jsonObj.surplusTotalAmount }</span></div> <div class="installTopTextFoot">还款日系统将自动从尾号<span>${jsonObj.bankCardNoEndNumber }</span>银行卡扣款</div> </div> </s:else> <div class="installInfoWrap"> <s:iterator value="jsonObj.repaymentList" var="repayment"> <div class="installInfo"> <div class="installInfoTop bg"> <div class="installInfoTopLeft"> <div class="installInfoTopLeftPic"> <s:if test='#repayment.status != "2"'> <img class="repayOrderCheck active" src="${base}/resources/img/borrowCheck.png" alt=""> </s:if> <s:else> <img src="${base}/resources/img/borrowNoCheck.png" alt=""> </s:else> </div> <div class="installInfoTopLeftInfo"> <div>借款<span>${repayment.borrowAmount }</span>元<span style="color:#32a7f6;margin-left:8px;" onclick="loanDetail(${repayment.borrowId })">详情</span></div> <span>${repayment.borrowDate }</span> </div> </div> <div class="installInfoTopRight">第 <span>${repayment.curNum }</span> 期</div> </div> <ul class="installInfoMid bg"> <li> <span>借款状态:</span> <s:if test='#repayment.status == "1" || #repayment.status == "3"'> <div class="ins_status">${repayment.statusName }</div> </s:if> <s:elseif test='#repayment.status == "2"'> <div class="ins_status_blue">${repayment.statusName }</div> </s:elseif> <s:else> <div class="ins_status_blue">${repayment.statusName }</div> </s:else> </li> <li> <span>还款期数:</span> <div>分 <span>${repayment.repaymentNum }</span> 期</div> </li> <li> <span>还款方式:</span> <div>每期等额</div> </li> <li> <span>还款日:</span> <div>${repayment.expiryDateFormat }</div> </li> <li> <span>已逾期(天):</span> <div><span>${repayment.overdueDays } </span>天</div> </li> <li> <span>逾期罚金:</span> <div> <span class="interest">${repayment.interest }</span>元 <span class="singleTotalAmount" style="display:none;">${repayment.totalAmount }</span> </div> </li> </ul> </div> </s:iterator> </div> <div class="D_payfor"> <div class="D_checkSure"><img class="repayOrderAllCheck active" src="${base}/resources/img/borrowCheck.png" alt="">全选</div> <ul class="D_checkSureNum"> <li class="D_selNum"> <div>已选<span class="or_num">${jsonObj.toRepayNum }</span>笔, </div> <div>逾期罚金:<span class="overdueFine">${jsonObj.overdueFine }</span>元</div> </li> <li class="D_selTotal">合计:<span class="totalAmount">${jsonObj.surplusTotalAmount }</span>元</li> </ul> <a class="goPay" href="javascript:void(0);">手动还款</a> </div>
JS
$(".repayOrderAllCheck").click(function(){ if($(this).hasClass("active")){ $(this).removeClass("active").attr("src","${base}/resources/img/borrowChecking.png"); $(".repayOrderCheck").each(function(element) { $(this).removeClass("active").attr("src","${base}/resources/img/borrowChecking.png"); }); $(".or_num").html(0); $(".totalAmount").html(0); $(".payTotalMoney").html(0); $(".overdueFine").html(0); }else{ var num = 0; var overdueFine = 0.00; var totalMoney = 0.00; $(this).addClass("active").attr("src","${base}/resources/img/borrowCheck.png"); $(".repayOrderCheck").each(function(element) { num = num+1; $(this).addClass("active").attr("src","${base}/resources/img/borrowCheck.png"); var interest = $(this).parents(".installInfo").find(".interest").html(); var singleTotalAmount = $(this).parents(".installInfo").find(".singleTotalAmount").html(); overdueFine = (parseFloat(overdueFine) + parseFloat(interest)).toFixed(2); totalMoney = (parseFloat(totalMoney) + parseFloat(singleTotalAmount)).toFixed(2); }); $(".or_num").html(num); $(".overdueFine").html(overdueFine); $(".totalAmount").html(totalMoney); $(".payTotalMoney").html(totalMoney); }});
阅读全文
0 0
- 全选和反选,怎么写,两种方法~
- 全选和反选的效果怎么做?
- 全选和反选
- 全选和反选
- 全选和反选
- 全选和反选
- 全选和反选
- 全选和反选
- 全选和反选
- 全选和反选
- 全选和反选
- checkbox的全选和反选,以及两种监听的区别
- checkbox全选,反选和取消全选
- js 实现复选框全选和反选 方法大全
- checkbox全选和反选
- javascript全选和反选
- 全选、全不选和反选
- select 全选和反选
- css的三大样式
- AngularJS ng-style 指令
- C#如何调用Python执行脚本,并将执行结果显示值显示至C#界面
- Spring xml 配置文件
- xshell 评估过期
- 全选和反选,怎么写,两种方法~
- php 回调函数及匿名函数
- java synchronized关键字的用法以及锁的等级:方法锁、对象锁、类锁
- mvn -deploy 报错 Failed to deploy artifacts: Could not transfer artifact
- Spring MVC session处理---@SessionAttributes
- Java Condition类
- QT创建TCP Socket通信
- 比较两个list集合是否相等
- JS调用指定名称的函数