<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" /> <link rel="stylesheet" type="text/css" href="../assets/css/weui.min.css" /> <link rel="stylesheet" type="text/css" href="../assets/css/swiper-3.4.2.min.css" /> <link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_773803_k1lcewwscuf.css" /> <script type="text/javascript" src="../assets/font/iconfont.js"></script> <script type="text/javascript" src="../js/base.js"></script> <link rel="stylesheet" href="../css/Pedestrian choice.css" /> <style> .weui-picker__group { font-size: 0.3rem; } .icon-duigou.now { color: rgb(254, 10, 1); } a{ color:#000; } .bianji{ margin-right:0.3rem; } </style> </head> <body> <ul class="people"> <li class="userInfo"> <div class="guo"> <div class="gli"> <!--<div>--> <div class="circle"> <i class="iconfont icon-duigou"></i> </div> <!--</div>--> <!--<i class="iconfont icon-yuancircle46"></i>--> <div class="xin"> <span class="guoxin"> <span class="name">郭新宇</span> 136120645435</span> <span>身份证:123543546576868</span> </div> </div> <div class="bian"> <a href="addPartner.html"> <div class="bianji"> <i class="iconfont icon-bianji"></i>编辑 </div> </a> <div class="delete"> <i class="iconfont icon-shanchu"></i> 删除 </div> </div> </div> </li> <li class="userInfo"> <div class="guo"> <div class="gli"> <div class="circle"> <i class="iconfont icon-duigou"></i> </div> <!--</div>--> <!--<i class="iconfont icon-yuancircle46"></i>--> <div class="xin"> <span class="guoxin"> <span class="name">郭新宇</span> 136120645435</span> <span>身份证:123543546576868</span> </div> </div> <div class="bian"> <a href="addPartner.html"> <div class="bianji"> <i class="iconfont icon-bianji"></i>编辑 </div> </a> <div class="delete"> <i class="iconfont icon-shanchu"></i>删除 </div> </div> </li> <li class="userInfo"> <div class="guo"> <div class="gli"> <div class="circle"> <i class="iconfont icon-duigou"></i> </div> <!--</div>--> <!--<i class="iconfont icon-yuancircle46"></i>--> <div class="xin"> <span class="guoxin"> <span class="name">郭新宇</span> 136120645435</span> <span>身份证:123543546576868</span> </div> </div> <div class="bian"> <a href="addPartner.html"> <div class="bianji"> <i class="iconfont icon-bianji"></i>编辑 </div> </a> <div class="delete"> <i class="iconfont icon-shanchu"></i>删除 </div> </div> </li> </ul> </div> <div class="quanxuan"> <div class="check"> <div class="circle" id="selectAll"> <i class="iconfont icon-duigou"></i> </div> <spn>全选</span> </div> <button class="agree" onclick="agreeFun()"> 确定 </button> </div> <a href="travelPartner.html"> <div class="tianjia ok"> 添加出行人 </div> </a> <script type="text/javascript" src="../assets/js/jquery-2.1.0.js"></script> <script type="text/javascript" src="../assets/js/swiper-3.4.2.min.js"></script> <script type="text/javascript" src="../assets/js/weui.js"></script> <script type="text/javascript" src="../index.js"></script> <script> </script> </body> </html> <script type="text/javascript"> $('.delete').click(function(){ $(this).parents('.userInfo').remove(); }) var num= $('.people li').length; var count = 0; var circle=$('.circle'); var nameArr = []; circle.click(function(){ if($(this).find('.icon-duigou').hasClass("now")){ $(this).find('.icon-duigou').removeClass("now"); $(this).find('.icon-duigou').css('color','rgba(255, 255, 255)'); $(this).css('border','0.02rem solid #999'); }else { $(this).find('.icon-duigou').addClass("now"); $(this).find('.icon-duigou').css('color','rgb(254, 10, 1)'); $(this).css('border','0.02rem solid rgb(254, 10, 1)'); } var len=$(".people").find('.icon-duigou.now').length; console.log(len); if(num == len) { $("#selectAll").css('border','0.02rem solid rgb(254, 10, 1)'); $("#selectAll").find('.icon-duigou').css('color','rgba(254, 10, 1)'); }else{ $("#selectAll").css('border','0.02rem solid rgb(153, 153, 153)'); $("#selectAll").find('.icon-duigou').css('color','rgb(255, 255, 255)'); } }) //全选反选 $("#selectAll").click(function(){ if(circle.find('.icon-duigou').css('color')=='rgb(255, 255, 255)'){ circle.find('.icon-duigou').css('color','rgb(254, 10, 1)'); circle.css('border','0.02rem solid rgb(254, 10, 1)'); }else{ circle.find('.icon-duigou').css('color','rgb(255, 255, 255)'); circle.css('border','0.02rem solid #999'); } }) var arr=[]; // 点击确定时,出行人名字添加到数组,回显到订单提交页面; function agreeFun() { var nameArr = []; for (var i = 0; i < $(".userInfo").length; i++ ) { if($(".userInfo").eq(i).find(".icon-duigou").hasClass("now")) { var name = $(".userInfo").find(".name").html(); if(nameArr.length >= 2) { break; }else { nameArr.push(name); } } } var name=encodeURI(encodeURI(nameArr)); var url="orders_submitted.html?name="+name; window.location.href = url; } //添加出行人 function getQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if(r != null) return unescape(r[2]); //return null; return '请选择出行人'; } function add(){ var arrlist=decodeURI(getQueryString('arrlist')).replace(/,/g ,' '); //$("#parentIndustryUL").append(" <li value="+industry.xyIndustryId+">"+industry.industryName+"</li>"); } //add(); </script>