Created
June 15, 2017 01:10
-
-
Save FingerLiu/783c0f4a51fd88451a5240c000974524 to your computer and use it in GitHub Desktop.
支付
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no"> | |
| <meta name="format-detection" content="telephone=no" /> | |
| <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /> | |
| <meta http-equiv="Pragma" content="no-cache" /> | |
| <meta http-equiv="Expires" content="0" /> | |
| <title>大学生超市(5号店)</title> | |
| <style type="text/css"> | |
| *{margin: 0;padding: 0;} | |
| h1,h2,h3,h4,h5,h6,strong{ | |
| font-weight: normal; | |
| } | |
| a{ | |
| text-decoration: none; | |
| } | |
| ul,ol,li{list-style: none;} | |
| input{ | |
| -webkit-appearance: none; | |
| } | |
| html{ | |
| background: #f8f8f8; | |
| /*-moz-user-select: none; | |
| -webkit-user-select: none; | |
| -ms-user-select: none; | |
| -khtml-user-select: none; | |
| user-select: none;*/ | |
| -webkit-touch-callout: none; | |
| font-family: "黑体","Helvetica Neue",Arial,Helvetica,sans-serif; | |
| } | |
| .error{color:#f8f8f8} | |
| b{font-weight: normal;} | |
| i,em{font-style: normal;} | |
| /*body{ | |
| position: relative; | |
| }*/ | |
| .fl{ | |
| float: left; | |
| } | |
| img { | |
| -webkit-user-select: none; | |
| } | |
| .fr{ | |
| float: right!important; | |
| } | |
| .clearfix:after { | |
| content: ""; | |
| display: block; | |
| clear: both; | |
| } | |
| .dblock{ | |
| display: block; | |
| } | |
| /* | |
| 基本样式 | |
| */ | |
| .db-float-left{ | |
| float: left!important; | |
| } | |
| .db-float-right{ | |
| float: right!important; | |
| } | |
| .db-back-white{ | |
| background: #FFFFFF!important; | |
| } | |
| .container{ | |
| min-height: 100%; | |
| font-size: .32rem; | |
| color: #1c1b21; | |
| } | |
| /* | |
| 头部 | |
| */ | |
| .header{ | |
| padding: .3rem 0 .3rem .24rem; | |
| overflow: hidden; | |
| } | |
| .icon-shop{ | |
| width: .65rem; | |
| height: .6rem; | |
| } | |
| .shop-name{ | |
| max-width: 5.5rem; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| text-overflow: ellipsis; | |
| margin-left: .39rem; | |
| height: .6rem; | |
| line-height: .6rem; | |
| } | |
| /* | |
| 支付金额 | |
| */ | |
| .payment{ | |
| position: relative; | |
| background: #fff; | |
| padding: .65rem .22rem .68rem; | |
| margin-bottom:.25rem; | |
| } | |
| .payment h4{ | |
| max-width: 5rem; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| text-overflow: ellipsis; | |
| position: absolute; | |
| left: 1.5rem; | |
| top: 0.4rem; | |
| } | |
| .blackcat{ | |
| overflow: hidden; | |
| position: absolute; | |
| top: .28rem; | |
| left: .23rem; | |
| } | |
| .blackcat img{ | |
| display: block; | |
| width: 1.14rem; | |
| height: .84rem; | |
| } | |
| .payment-cont{ | |
| padding-left: 0.27rem; | |
| padding-right: 0.24rem; | |
| height: 1.94rem; | |
| border: 0.03rem solid #1aad19; | |
| border-radius: 10px; | |
| background: #ffffff; | |
| overflow: hidden; | |
| } | |
| .payment-cont p{ | |
| font-size: 0.34rem; | |
| height: 1.94rem; | |
| line-height: 1.94rem; | |
| } | |
| .payment-cont .payment-cont-icon,.payment-cont .payment-cont-num{ | |
| font-size: 0.68rem; | |
| } | |
| .payment-center .payment-cont-num{ | |
| font-size: 1rem | |
| } | |
| .payment-cont-icon{ | |
| width: 0.72rem; | |
| } | |
| .payment-cont-icon span{ | |
| float: left; | |
| line-height: 1.94rem; | |
| } | |
| #marker{ | |
| line-height: 1.94rem; | |
| } | |
| /* 支付金额 样式2 */ | |
| .payment2 {background: transparent;padding-bottom: 0;text-align: center;padding-top: 1rem} | |
| /* | |
| 固定金额页 | |
| */ | |
| .fixed-payment{ | |
| padding: 1.1rem 0.22rem; | |
| } | |
| .fixed-shop-name{ | |
| width: 7rem; | |
| margin: 0 auto; | |
| text-align: center; | |
| font-size: 0.34rem; | |
| color: #333; | |
| } | |
| .fixed-amount{ | |
| font-size: 0.8rem; | |
| text-align: center; | |
| color: #1aad19; | |
| margin-top: 0.5rem; | |
| } | |
| /* | |
| 选择优惠券 | |
| */ | |
| .tickets-detial,.voucher-detial,.stored-card,.wxpay-bar{ | |
| height: 0.96rem; | |
| overflow: hidden; | |
| padding: 0 .22rem; | |
| line-height: 0.96rem; | |
| border-bottom: 1px solid #f8f8f8; | |
| background: #fff; | |
| } | |
| /*.card-balance{ | |
| height: 0.5rem; | |
| overflow: hidden; | |
| padding: 0 .23rem; | |
| line-height: 0.5rem; | |
| background: #fff; | |
| } | |
| .stored-card,.wxpay-bar{ | |
| border: none; | |
| font-size: 0.3rem; | |
| } | |
| .card-balance .balance{ | |
| color: red; | |
| }*/ | |
| .tickets-detial i,.voucher-detial i,.stored-card i,.wxpay-bar i{ | |
| width: 0.32rem; | |
| height: 0.32rem; | |
| float: left; | |
| background: url("https://style.duolabao.cn/order/img/wxpay/radio.png") no-repeat; | |
| background-position: center center; | |
| background-size: 100% 100%; | |
| margin-right: 0.1rem; | |
| margin-top:0.31rem; | |
| } | |
| .stored-card .actual-amount,.stored-card .deductible-amount{ | |
| color: #999; | |
| text-decoration: line-through; | |
| font-size: 0.25rem; | |
| } | |
| .tickets-detial span,.voucher-detial span{ | |
| float: left; | |
| font-size: 0.3rem; | |
| } | |
| .tickets-detial span:nth-child(3),.voucher-detial span:nth-child(4){ | |
| font-size: 0.3rem; | |
| color: #b4b4b4; | |
| } | |
| .wxpay-bar{ | |
| display: none; | |
| } | |
| .wxpay-bar i{ | |
| background: none; | |
| } | |
| .wxpay-bar span{ | |
| color: #1aad19; | |
| } | |
| /*嗨卡持卡人样式*/ | |
| .changeSendCard,.cardholder{ | |
| height: 1.2rem; | |
| line-height: 1.2rem; | |
| } | |
| .changeSendCard i,.cardholder i{ | |
| margin-right: 0.1rem; | |
| margin-top:0.43rem; | |
| } | |
| .changeSendCard em,.cardholder em{ | |
| line-height: 0.4rem; | |
| font-size: 0.28rem; | |
| } | |
| .changeSendCard .ft-42,.cardholder .ft-42{ | |
| font-size: 0.42rem; | |
| margin-top: 0.2rem; | |
| } | |
| /*选中情况下*/ | |
| .radio-selected i{ | |
| background: url("https://style.duolabao.cn/order/img/wxpay/radio-wxselected.png") no-repeat; | |
| background-position: center center; | |
| background-size: 100% 100%; | |
| } | |
| .jd .radio-selected i{ | |
| background: url("https://style.duolabao.cn/order/img/wxpay/radio-jdselected.png") no-repeat; | |
| background-position: center center; | |
| background-size: 100% 100%; | |
| } | |
| .zfb .radio-selected i{ | |
| background: url("https://style.duolabao.cn/order/img/wxpay/radio-zfbselected.png") no-repeat; | |
| background-position: center center; | |
| background-size: 100% 100%; | |
| } | |
| .radio-selected span:nth-child(2){ | |
| color: #06be04; | |
| } | |
| .radio-selected span em{ | |
| color: #06be04; | |
| } | |
| /*更新*/ | |
| .jd .radio-selected span:nth-child(2){ | |
| color: #e1232f; | |
| } | |
| .zfb .radio-selected span:nth-child(2){ | |
| color: #00aaef; | |
| } | |
| .qq .radio-selected span:nth-child(2){ | |
| color: #2aadd9; | |
| } | |
| .radio-selected span b{ | |
| color: #faab02; | |
| } | |
| .radio-selected span:nth-child(3){ | |
| text-align: right; | |
| color: #b4b4b4; | |
| } | |
| .no-voucher{ | |
| width: 2.5rem; | |
| height: 0.63rem; | |
| text-align: right; | |
| padding-right: 0.2rem; | |
| overflow: hidden; | |
| } | |
| .voucher-detial span.yes-voucher{ | |
| color: #faac02; | |
| } | |
| .radio-selected span{ | |
| color: #1aad19; | |
| } | |
| .radio-selected .no-voucher{ | |
| background: none; | |
| } | |
| .radio-selected span.yes-voucher{ | |
| color: #1aad19; | |
| } | |
| /*京东钱包下面优惠券选中的颜色*/ | |
| .jd .radio-selected span{ | |
| color: #e1232f; | |
| } | |
| .zfb .radio-selected span{ | |
| color: #00aaef; | |
| } | |
| .qq .radio-selected span{ | |
| color: #2aadd9; | |
| } | |
| .radio-selected span:nth-of-type(3){ | |
| width: 2.5rem; | |
| text-align: right; | |
| } | |
| .radio-selected.cardholder em{ | |
| color: #1aad19; | |
| text-align: right; | |
| } | |
| /* | |
| 输入键盘 | |
| */ | |
| .keybord-box{ | |
| width: 100%; | |
| position: fixed; | |
| bottom: -4.9rem; | |
| left: 0px; | |
| } | |
| .support-box{ | |
| height: 0.26rem; | |
| padding: 0 0.3rem; | |
| margin-bottom: 0.2rem; | |
| } | |
| .support{ | |
| height: 0.26rem; | |
| width: 100%; | |
| background: url("https://style.duolabao.cn/order/img/wxpay/support.png") no-repeat center; | |
| background-size: 100%; | |
| } | |
| .keybord{ | |
| width: 100%; | |
| border-collapse: collapse; | |
| } | |
| .keybord td{ | |
| width: 25%; | |
| height: 0.99rem; | |
| line-height: 0.99rem; | |
| text-align: center; | |
| font-size: 0.54rem; | |
| -moz-user-select: none; | |
| -webkit-user-select: none; | |
| -ms-user-select: none; | |
| -khtml-user-select: none; | |
| user-select: none; | |
| border: 1px solid #c9c9c9; | |
| } | |
| .keybord .keybord-back,.keybord .keybord-down{ | |
| line-height: 0; | |
| } | |
| .keybord-back img{ | |
| width: .72rem; | |
| height: .5rem; | |
| } | |
| .keybord-back{ | |
| background:#fff url("https://style.duolabao.cn/order/img/wxpay/keyboard-ico.png") no-repeat; | |
| background-position: top center; | |
| background-size: 34% 2rem; | |
| } | |
| .retract{ | |
| background:#fff url("https://style.duolabao.cn/order/img/wxpay/keyboard-ico.png") no-repeat; | |
| background-position: bottom center; | |
| background-size: 34% 1.8rem; | |
| } | |
| .keybord .border-top{ | |
| border-top: 1px solid #dfdede; | |
| } | |
| .keybord .border-left{ | |
| border-left: 0.5px solid #dfdede; | |
| } | |
| .keybord .makesure{ | |
| height: 75%; | |
| line-height: .7rem; | |
| background: #d7d3d4; | |
| color: #ffffff; | |
| } | |
| /*确认支付可以点击时微信和京东的不同状态*/ | |
| .keybord .canClick{ | |
| background: #1aad19; | |
| } | |
| .jd .canClick{ | |
| background: #e1232f; | |
| } | |
| .zfb .canClick{ | |
| background: #00aaef; | |
| } | |
| .qq .canClick{ | |
| background: #2aadd9; | |
| } | |
| .keybord .makesure span{ | |
| display: block; | |
| } | |
| .keybord-down img{ | |
| width: .48rem; | |
| height: .48rem; | |
| } | |
| /* | |
| 不能输入金额的页面 | |
| */ | |
| .lastpay-box{ | |
| width: 100%; | |
| position: fixed; | |
| bottom: .37rem; | |
| } | |
| .lastpay-box-next{ | |
| width: 100%; | |
| padding-top: .25rem | |
| } | |
| .lastpay{ | |
| padding: .34rem 0; | |
| width: 7rem; | |
| text-align: center; | |
| background: #d7d3d4; | |
| border-radius: 5px; | |
| color: #fff; | |
| font-size: .34rem; | |
| margin: 0 auto; | |
| } | |
| /*京东和支付宝下固定金额确认按钮颜色*/ | |
| .lastpay-box .canClick, .lastpay-box-next .canClick{ | |
| background: #06be04; | |
| } | |
| .jd .lastpay-box .canClick, .jd .lastpay-box-next .canClick{ | |
| background: #e1232f; | |
| } | |
| .zfb .lastpay-box .canClick, .zfb .lastpay-box-next .canClick{ | |
| background: #00aaef; | |
| } | |
| .qq .lastpay-box .canClick, .qq .lastpay-box-next .canClick{ | |
| background: #2aadd9; | |
| } | |
| /* | |
| 完成页面 | |
| */ | |
| .endpage{ | |
| height: 2.1rem; | |
| background: #fff; | |
| padding-top: 0.44rem; | |
| } | |
| .endpage img:nth-child(1){ | |
| display: block; | |
| margin: 0 auto; | |
| width: .86rem; | |
| height: .86rem; | |
| } | |
| .endpage p:nth-child(2){ | |
| margin-top: .2rem; | |
| font-size: .4rem; | |
| font-weight: bold; | |
| text-align: center; | |
| } | |
| .pay-team{ | |
| margin-top: .23rem; | |
| } | |
| .pay-team .pay-detial{ | |
| padding: 0 .23rem; | |
| height: 0.8rem; | |
| line-height: 0.8rem; | |
| border-bottom: .02rem solid #f8f8f8; | |
| } | |
| .pay-team .pay-tit{ | |
| color: #adadad; | |
| } | |
| .advert{ | |
| width: 7.06rem; | |
| height: 3.48rem; | |
| margin-top: .64rem; | |
| padding: 0 .23rem; | |
| position: relative; | |
| } | |
| .advert img{ | |
| width: 100%; | |
| height: auto; | |
| } | |
| /*分享朋友圈的蒙层*/ | |
| .share-layer{ | |
| width: 100%; | |
| height: 100%; | |
| background: rgba(0,0,0,0.7); | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| display: none; | |
| } | |
| .share-arrow{ | |
| height: 1.25rem; | |
| background: url("https://style.duolabao.cn/order/img/wxpay/white-arrow.png") 93% top no-repeat; | |
| background-size: contain; | |
| } | |
| .share-pic{ | |
| height: 3.68rem; | |
| background: url("https://style.duolabao.cn/order/img/wxpay/card-share.png") center top no-repeat; | |
| background-size: contain; | |
| } | |
| .share-layer p{ | |
| margin-top: 0.66rem; | |
| text-align: center; | |
| color: #fff; | |
| font-size: 0.26rem; | |
| } | |
| .pay-word{ | |
| width: 5rem; | |
| text-align: right; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| text-overflow: ellipsis; | |
| } | |
| .pay-word strong{ | |
| color: red; | |
| font-size: 0.4rem; | |
| } | |
| .pay-word em{ | |
| color: #787878; | |
| } | |
| /* | |
| dialog-s | |
| */ | |
| .dialog-bg{ | |
| display: none; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| background: gray; | |
| opacity: .5; | |
| } | |
| .dialog{ | |
| display: none; | |
| position: absolute; | |
| top: .2rem; | |
| left: 0; | |
| width: 100%; | |
| font-size: .34rem; | |
| } | |
| .dialog-inn{ | |
| width: 7.07rem; | |
| margin: 0 auto; | |
| font-size: .34rem; | |
| } | |
| .dialog-head{ | |
| height: 1.1rem; | |
| line-height: 1.1rem; | |
| background: #fff; | |
| border-radius: 10px 10px 0 0; | |
| border-bottom: .04rem solid #d2d1d1; | |
| overflow: hidden; | |
| } | |
| .dialog-head p{ | |
| font-weight: bold; | |
| } | |
| .dialog-head span{ | |
| color: #faab02; | |
| } | |
| .dialog-head p:nth-of-type(1){ | |
| padding-left: .26rem; | |
| } | |
| .dialog-head p:nth-of-type(2){ | |
| padding-right: .26rem; | |
| } | |
| /* | |
| 优惠券的票票 | |
| */ | |
| .dialog-cont{ | |
| padding: 0 .25rem .32rem; | |
| height: 7.55rem; | |
| background: #eeeeee; | |
| overflow: auto; | |
| } | |
| .dialog-cont li{ | |
| overflow: hidden; | |
| margin-top: .32rem; | |
| } | |
| .dialog-cont .quick-l{ | |
| width: .61rem; | |
| height: 1.9rem; | |
| background: url("https://style.duolabao.cn/order/img/wxpay/quick-ico.png") no-repeat; | |
| background-position: top right; | |
| background-size: 100% 200%; | |
| } | |
| .dialog-cont .quick-m{ | |
| width: 5.08rem; | |
| height: 1.9rem; | |
| background: url("https://style.duolabao.cn/order/img/wxpay/icon-quick-m.png") right 0 no-repeat; | |
| background-color: #fefdfd; | |
| background-size: auto 100%; | |
| } | |
| .dialog-cont .quick-tit{ | |
| height: .5rem; | |
| line-height: .5rem; | |
| border-bottom: .02rem dashed #e8e7e7; | |
| } | |
| .dialog-cont .quick-tit var{ | |
| padding-left: .16rem; | |
| font-style: normal; | |
| font-size: .35rem; | |
| color: #b1b1b1; | |
| } | |
| .dialog-cont .quick-tit span{ | |
| font-size: .2rem; | |
| color: #b1b1b1; | |
| padding-right: .27rem; | |
| } | |
| .dialog-cont .quick-con{ | |
| height: .45rem; | |
| padding: .26rem 0 .23rem .16rem; | |
| } | |
| .dialog-cont .quick-con span{ | |
| font-size: .4rem; | |
| color: #b1b1b1; | |
| } | |
| .dialog-cont .quick-con strong{ | |
| font-size: .45rem; | |
| color: #b1b1b1; | |
| } | |
| .dialog-cont .quick-bot{ | |
| padding-left: .16rem; | |
| font-size: .24rem; | |
| color: #b1b1b1; | |
| } | |
| .dialog-cont .quick-r{ | |
| width: 0.6rem; | |
| height: 0.6rem; | |
| margin-top: 0.65rem; | |
| background: url("https://style.duolabao.cn/order/img/wxpay/gou-ico.png") no-repeat; | |
| background-position: top right; | |
| background-size: 100% 202%; | |
| } | |
| /* | |
| dialog券列表有三种状态，没选中是可用的状态quick-list，选中是quick-chiose，不能用的是quick-useless | |
| */ | |
| .dialog-cont .quick-list .quick-r{ | |
| background: url("https://style.duolabao.cn/order/img/wxpay/gou-ico.png") no-repeat; | |
| background-position: top right; | |
| background-size: 100% 202%; | |
| } | |
| .dialog-cont .quick-chiose .quick-r{ | |
| background: url("https://style.duolabao.cn/order/img/wxpay/gou-ico.png") no-repeat; | |
| background-position: bottom right; | |
| background-size: 100% 202%; | |
| } | |
| /* | |
| dialog券列表有三种状态,不能用的是quick-useless | |
| */ | |
| .dialog-cont .quick-list .quick-l{ | |
| background: url("https://style.duolabao.cn/order/img/wxpay/quick-ico.png") no-repeat; | |
| background-position: bottom right; | |
| background-size: 100% 200%; | |
| } | |
| .dialog-cont .quick-list .quick-tit var, .dialog-cont .quick-list .quick-con span, .dialog-cont .quick-list .quick-con strong{ | |
| color: #faab02; | |
| } | |
| /*优惠券底部*/ | |
| .dialog-foot{ | |
| background: #eeeeee; | |
| border-radius: 0 0 10px 10px; | |
| padding: .3rem .1rem .43rem 0; | |
| } | |
| .dialog-foot-sure{ | |
| height: 1.1rem; | |
| width: 6.55rem; | |
| margin: 0 auto; | |
| border-radius: 5px; | |
| line-height: 1.1rem; | |
| text-align: center; | |
| color: #fff; | |
| font-size: .38rem; | |
| background: #1aad19; | |
| } | |
| /*京东下按钮的颜色*/ | |
| .jd .dialog-foot-sure{ | |
| background: #e1232f; | |
| } | |
| .zfb .dialog-foot-sure{ | |
| background: #00aaef; | |
| } | |
| .qq .dialog-foot-sure{ | |
| background: #2aadd9; | |
| } | |
| .pay-team strong{ | |
| font-weight: bold; | |
| font-size: 0.36rem; | |
| } | |
| .loading-bg, .loading-card-bg{ | |
| width: 100%; | |
| height: 100%; | |
| position: absolute; | |
| left: 0; | |
| top: 0; | |
| z-index: 99; | |
| /*background: rgba(22,22,22,0.5);*/ | |
| display: none; | |
| } | |
| .loading{ | |
| width: 3.12rem; | |
| height: 3.12rem; | |
| position: absolute; | |
| left: 50%; | |
| top: 45%; | |
| margin-left: -1.56rem; | |
| margin-top: -1.56rem; | |
| border-radius: 0.2rem; | |
| z-index: 100; | |
| background: rgba(0,0,0,0.5); | |
| } | |
| .loading img{ | |
| width: 96px; | |
| height: 96px; | |
| position: absolute; | |
| left: 50%; | |
| top: 50%; | |
| margin-left: -48px; | |
| margin-top: -48px; | |
| } | |
| .loadingApp{width:.8rem;position:fixed;left:50%;top:50%;border-radius: .2rem;z-index: 100;background: rgba(0,0,0,0.5);padding:.2rem;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-o-transform: translate(-50%, -50%);transform: translate(-50%, -50%);} | |
| .loadingApp img{width: 100%;display: block} | |
| .advert2{ | |
| padding: .58rem .22rem; | |
| background: #fff; | |
| margin-top: .2rem; | |
| text-decoration: none; | |
| } | |
| .advert2 .ad_btn{ | |
| border-radius: 1rem; | |
| display: block; | |
| color:#1aad19; | |
| border:1px solid #1aad19; | |
| width:1.56rem; | |
| height:.72rem; | |
| text-align: center; | |
| line-height: .72rem; | |
| font-size: .32rem; | |
| margin-top: 0.09rem; | |
| } | |
| .advert2 h5{ | |
| width:1rem; | |
| height:1rem; | |
| margin-right:.2rem; | |
| } | |
| .advert2 h5 img{ | |
| width:100%; | |
| } | |
| .advert2 h3{ | |
| max-width: 4rem; | |
| overflow: hidden; | |
| white-space: nowrap; | |
| text-overflow: ellipsis; | |
| color:#1aad19; | |
| font-size: .3rem; | |
| line-height: .5rem; | |
| } | |
| .advert2 h3 strong{ | |
| color:#333; | |
| } | |
| .advert2 h4{ | |
| max-width: 4rem; | |
| overflow: hidden; | |
| white-space: nowrap; | |
| text-overflow: ellipsis; | |
| font-size: .26rem; | |
| color:#787878; | |
| line-height: .5rem; | |
| } | |
| @keyframes mymove | |
| { | |
| from {opacity:0;} | |
| to {opacity:1;} | |
| } | |
| @-webkit-keyframes mymove /*Safari and Chrome*/ | |
| { | |
| from {opacity:0;} | |
| to {opacity:1;} | |
| } | |
| /* | |
| 推荐卡列表 | |
| */ | |
| .recommend-list{ | |
| width: 100%; | |
| background: #fff; | |
| position: fixed; | |
| bottom: -7.1rem; | |
| } | |
| .recommend-list-hd{ | |
| height: 0.84rem; | |
| line-height: 0.84rem; | |
| text-align: center; | |
| color: #1aad19; | |
| border-bottom: 0.03rem solid #f4f4f4; | |
| } | |
| .recommend-prompt{ | |
| height: 0.78rem; | |
| font-size: 0.28rem; | |
| text-align: left; | |
| line-height: 0.78rem; | |
| padding-left: 0.22rem; | |
| color: #000; | |
| border-top: 0.03rem solid #f4f4f4; | |
| border-bottom: 0.03rem solid #f4f4f4; | |
| } | |
| .recommend-prompt strong{ | |
| color: #1aad19; | |
| } | |
| .recommend-prompt span i{ | |
| color: #1aad19; | |
| } | |
| .recommend-list-con{ | |
| width: 100%; | |
| /*height: 1.42rem;*/ | |
| overflow-x: scroll; | |
| padding: 0.22rem 0; | |
| } | |
| .recommend-list-con ul{ | |
| padding-right: 0.22rem; | |
| } | |
| .recommend-list-con ul li { | |
| /*height: 0.94rem;*/ | |
| width: 2.04rem; | |
| padding: 0.08rem 0; | |
| border: 0.03rem solid #f4f4f4; | |
| border-radius: 0.2rem; | |
| margin-left: 0.22rem; | |
| background: #fafafa; | |
| } | |
| .recommend-list-con ul li h4{ | |
| font-size: 0.36rem; | |
| color: #333; | |
| text-align: center; | |
| line-height: 0.5rem; | |
| } | |
| .recommend-list-con p{ | |
| font-size: 0.3rem; | |
| color: #888888; | |
| text-align: center; | |
| line-height: 0.46rem; | |
| } | |
| /*选中后样式*/ | |
| .recommend-list-con ul li.recommend-selected{ | |
| background: #f1fcf1; | |
| border: 0.03rem solid #1aad19; | |
| } | |
| .recommend-list-con .recommend-selected h4{ | |
| color: #faac02; | |
| } | |
| .recommend-list-con .recommend-selected p{ | |
| color: #1aad19; | |
| } | |
| .recommend-list-con .recommend-selected p span{ | |
| color: #1aad19; | |
| } | |
| /*底部样式*/ | |
| .recommend-list-ht{ | |
| height: 2.24rem; | |
| } | |
| .recommend-list-ht a{ | |
| width: 6.7rem; | |
| height: 0.92rem; | |
| line-height: 0.92rem; | |
| text-align: center; | |
| border: 0.03rem solid #1aad19; | |
| border-radius: 0.1rem; | |
| margin-top: 0.64rem; | |
| display: block; | |
| margin: 0 auto; | |
| } | |
| .recommend-list-ht .pay-btn{ | |
| background: #fff; | |
| color: #1aad19; | |
| margin-top: 0.4rem; | |
| } | |
| .recommend-list-ht .handle-btn{ | |
| background: #1aad19; | |
| color: #fff; | |
| margin-top: 0.4rem; | |
| } | |
| .disclaimer{ | |
| color: #8f8f8f; | |
| font-size: 0.24rem; | |
| line-height: 0.9rem; | |
| text-align: center; | |
| } | |
| /*注册*/ | |
| .register-bg{ | |
| width: 100%; | |
| height: 100%; | |
| position: fixed; | |
| left: 0; | |
| top: 0; | |
| background: rgba(0,0,0,0.8); | |
| display: none; | |
| } | |
| .register-box{ | |
| width: 6.84rem; | |
| /*height: 5.82rem;*/ | |
| background: #fff; | |
| position: absolute; | |
| left: 50%; | |
| top: 0; | |
| margin-left: -3.42rem; | |
| border-radius: 0.3rem; | |
| padding-bottom: 0.48rem; | |
| } | |
| .register-box h4{ | |
| height: 1.28rem; | |
| text-align: center; | |
| line-height: 1.28rem; | |
| color: #1aad19; | |
| font-size: 0.42rem; | |
| border-bottom: 0.03rem solid #f4f4f4; | |
| } | |
| .register-con{ | |
| padding: 0.48rem 0.26rem; | |
| padding-bottom: 0.2rem; | |
| } | |
| .register-con .phoneNum{ | |
| display: block; | |
| width: 5.9rem; | |
| height: 0.9rem; | |
| margin: 0 auto; | |
| border: 0.03rem solid #d7d3d4; | |
| border-radius: 0.1rem; | |
| padding: 0 0.2rem; | |
| font-size: 0.28rem; | |
| outline: none; | |
| margin-bottom: 0.26rem; | |
| } | |
| .register-con .vcode{ | |
| width: 3.42rem; | |
| height: 0.9rem; | |
| border: 0.03rem solid #d7d3d4; | |
| border-radius: 0.1rem; | |
| padding: 0 0.2rem; | |
| font-size: 0.28rem; | |
| outline: none; | |
| } | |
| .register-con .vcode-btn{ | |
| width: 2.18rem; | |
| height: 0.9rem; | |
| border: 0.03rem solid #1aad19; | |
| border-radius: 0.1rem; | |
| color: #1aad19; | |
| text-align: center; | |
| line-height: 0.9rem; | |
| font-size: 0.34rem; | |
| } | |
| .register-box .disabled-btn{ | |
| border: 0.03rem solid #999; | |
| color: #999; | |
| background: #eee; | |
| } | |
| .register-btn{ | |
| display: block; | |
| width: 6.48rem; | |
| height: 0.94rem; | |
| background: #1aad19; | |
| margin: 0 auto; | |
| text-align: center; | |
| line-height: 0.94rem; | |
| border-radius: 0.1rem; | |
| color: #fff; | |
| font-size: 0.34rem; | |
| } | |
| .close-btn{ | |
| width: 0.9rem; | |
| height: 0.9rem; | |
| position: absolute; | |
| left: 0; | |
| top: 0; | |
| background: url(https://style.duolabao.cn/order/img/wxpay/close.png) no-repeat center; | |
| background-size: 60%; | |
| } | |
| .error-msg{ | |
| font-size: 0.28rem; | |
| color: #ee3333; | |
| padding: 0 0.3rem; | |
| margin-bottom: 0.1rem; | |
| } | |
| .agreement{ | |
| font-size: 0.24rem; | |
| color: #8f8f8f; | |
| padding-left: 0.24rem; | |
| margin-top: 0.24rem; | |
| text-align: center; | |
| } | |
| .agreement a{ | |
| color: #333; | |
| text-decoration: underline; | |
| } | |
| .register-prompt{ | |
| font-size: 0.26rem; | |
| color: #8f8f8f; | |
| margin-bottom: 0.35rem; | |
| padding-left: 0.24rem; | |
| } | |
| .register-prompt strong{ | |
| color: #1aad19; | |
| } | |
| .register-prompt em{ | |
| color: #787878; | |
| } | |
| /*错误弹框*/ | |
| .error-dialog-box{ | |
| position: absolute; | |
| width: 100%; | |
| height: 100%; | |
| left: 0; | |
| top: 0; | |
| background: rgba(0,0,0,0.6); | |
| /*display: none;*/ | |
| z-index: 999; | |
| } | |
| .error-dialog{ | |
| width: 6.8rem; | |
| /*height: 3.12rem;*/ | |
| position: absolute; | |
| left: 50%; | |
| top: 45%; | |
| margin-top: -1.5rem; | |
| margin-left: -3.4rem; | |
| background: #fff; | |
| border-radius: 0.1rem; | |
| } | |
| .error-dialog p{ | |
| line-height: 0.4rem; | |
| color: #999; | |
| text-align: center; | |
| font-size: 0.32rem; | |
| border-bottom: 0.03rem solid #e9e9eb; | |
| padding: 0.6rem 0.22rem; | |
| } | |
| .close-dialog-btn{ | |
| line-height: 1rem; | |
| display: block; | |
| text-align: center; | |
| font-size: 0.4rem; | |
| color: #1aad19; | |
| } | |
| /*会员卡支付弹框*/ | |
| .vip-card-bg{ | |
| position: fixed; | |
| left: 0; | |
| top: 0; | |
| width: 100%; | |
| height: 100%; | |
| background: rgba(0,0,0,0.8); | |
| display: none; | |
| } | |
| .vip-card-box{ | |
| width: 6.49rem; | |
| min-height: 7.7rem; | |
| position: absolute; | |
| left: 50%; | |
| top: 40%; | |
| margin-left: -3.425rem; | |
| margin-top: -3.85rem; | |
| background: #fff; | |
| border-radius: 0.2rem; | |
| padding: 0.1rem 0.18rem; | |
| } | |
| .vip-card-box h3{ | |
| text-align: center; | |
| font-size: 0.42rem; | |
| color: #1aad19; | |
| line-height: 1.02rem; | |
| border-bottom: 2px solid #f4f4f4; | |
| } | |
| .card-order-box{ | |
| width: 6.5rem; | |
| height: 1.38rem; | |
| margin: 0 auto; | |
| background: #f9f9f9; | |
| padding-top: 0.4rem; | |
| margin-bottom: 0.22rem; | |
| } | |
| .card-order-box h4{ | |
| font-size: 0.26rem; | |
| color: #333; | |
| text-align: center; | |
| margin-bottom: 0.2rem; | |
| } | |
| .card-order-box p{ | |
| font-size: 0.56rem; | |
| color: #333; | |
| text-align: center; | |
| } | |
| .card-order-list{ | |
| border-top: 2px solid #f4f4f4; | |
| margin-bottom: 0.4rem; | |
| } | |
| .card-order-list li{ | |
| font-size: 0.26rem; | |
| line-height: 0.7rem; | |
| border-bottom: 2px solid #f4f4f4; | |
| padding: 0 0.2rem; | |
| color: #333; | |
| } | |
| .card-order-list span{ | |
| max-width: 50%; | |
| overflow: hidden; | |
| white-space: nowrap; | |
| text-overflow: ellipsis; | |
| } | |
| .card-order-list span em{ | |
| font-size: 0.26rem; | |
| color: #8f8f8f; | |
| } | |
| .wxPayAmount{ | |
| color: #e10028; | |
| } | |
| .card-again-btn{ | |
| display: block; | |
| width: 5.52rem; | |
| height: 0.92rem; | |
| margin: 0 auto; | |
| line-height: 0.92rem; | |
| font-size: 0.3rem; | |
| text-align: center; | |
| color: #fff; | |
| background: #1aad19; | |
| border: 1px solid #1aad19; | |
| border-radius: 0.1rem; | |
| margin-bottom: 0.32rem; | |
| } | |
| .vip-card-sureBtn{ | |
| display: block; | |
| width: 5.52rem; | |
| height: 0.92rem; | |
| margin: 0 auto; | |
| line-height: 0.92rem; | |
| font-size: 0.3rem; | |
| text-align: center; | |
| color: #1aad19; | |
| background: #fff; | |
| border: 1px solid #1aad19; | |
| border-radius: 0.1rem; | |
| margin-bottom: 0.32rem; | |
| } | |
| .direct-pay-btn{ | |
| background: #1aad19; | |
| color: #fff; | |
| } | |
| .vip-card-close{ | |
| position: absolute; | |
| left: 0.18rem; | |
| top: 0.18rem; | |
| width: 0.45rem; | |
| height: 0.45rem; | |
| background: url(https://style.duolabao.cn/order/img/wxpay/close.png) no-repeat center; | |
| background-size: contain; | |
| } | |
| /*活动条*/ | |
| .active-bar{ | |
| position: relative; | |
| height: 1.2rem; | |
| line-height: 1.2rem; | |
| margin-top: 0.2rem; | |
| padding-left: 0.64rem; | |
| color: #333; | |
| } | |
| .active-bar p{ | |
| width: 0.75rem; | |
| height: 0.7rem; | |
| background: url("https://style.duolabao.cn/order/img/wxpay/active.png") no-repeat; | |
| background-size: contain; | |
| position: absolute; | |
| left: 0; | |
| top: 0; | |
| } | |
| .active-bar span i{ | |
| color: #1aad19; | |
| } | |
| .active-bar strong{ | |
| width: 0.32rem; | |
| height: 0.32rem; | |
| background: url("https://style.duolabao.cn/order/img/wxpay/green-arrow.png") no-repeat; | |
| background-size: contain; | |
| margin-right: 0.22rem; | |
| margin-top: 0.44rem; | |
| } | |
| </style> | |
| <script> | |
| (function () { | |
| document.addEventListener('DOMContentLoaded', function () { | |
| var html = document.documentElement; | |
| var windowWidth = html.clientWidth; | |
| html.style.fontSize = windowWidth / 7.5 + 'px'; | |
| // 等价于html.style.fontSize = windowWidth / 640 * 100 + 'px'; | |
| }, false); | |
| })(); | |
| var _hmt = _hmt || []; | |
| </script> | |
| </head> | |
| <!-- ===========提交的表单========== --> | |
| <form action="" method="POST" id="payForm"> | |
| <input type="hidden" id="amount" name="orderAmount" value="" /> | |
| <input type="hidden" id="machineNum" name="machineNum" value="10011014653816835428035" /> | |
| <input type="hidden" id="customerNum" name="customerNum" value="10001114727008914570631" /> | |
| <input type="hidden" id="shopNum" name="shopNum" value="10001214727011915756772" /> | |
| <input type="hidden" id="memberNum" name="memberNum" value="10101014974440749529543" /> | |
| <input type="hidden" id="source" name="source" value="FIXCODE" /> | |
| <input type="hidden" id="tableNum" name="tableNum" value="N" /> | |
| <input type="hidden" id="cashedNum" name="voucherNum" value="" /> | |
| <input type="hidden" id="openId" name="openId" value="ojiuXuEmO3C8KkCw_E0v-NN93FSE" /> | |
| <input type="hidden" id="requestNum" name="requestNum" value="" /> | |
| <input type="hidden" id="payWay" name="payWay" value="WX" /> | |
| <input type="hidden" id="orderNum" name="orderNum" value="" /> | |
| <input type="hidden" id="marketingType" name="marketingType" value="" /> | |
| <input type="hidden" id="dlbCardUrl" name="dlbCardUrl" value="" /> | |
| <input type="hidden" id="userId" name="userId" value="" /> | |
| <input type="hidden" id="authId" name="authId" value="ojiuXuEmO3C8KkCw_E0v-NN93FSE" /> | |
| <input type="hidden" id="cardPay" name="cardPay" value="" /> | |
| <input type="hidden" id="onceCardBlackNum" name="onceCardBlackNum" value="" /> | |
| <input type="hidden" id="machineForCardPay" name="machineForCardPay" value="10011014501481567301408" /> | |
| <input type="hidden" id="machineForBuyingCard" name="machineForBuyingCard" value="10011014501481567041407" /> | |
| <input type="hidden" id="minDiscount" name="minDiscount" value="" /> | |
| <input type="hidden" id="cardDiscount" name="cardDiscount" value="" /> | |
| <input type="hidden" id="cardBalance" name="cardBalance" value="" /> | |
| <input type="hidden" id="cardKindNum" name="cardKindNum" value="" /> | |
| <input type="hidden" id="cardKindList" name="cardKindList" value='' /> | |
| <input type="hidden" id="cardKindType" name="cardKindType" value='' /> | |
| <input type="hidden" id="cardAgainFlag" name="cardAgainFlag" value="" /> | |
| </form> | |
| <form action="" id="buyCard"> | |
| <input type="hidden" id="cardAgainBankRequestNum" name="cardAgainBankRequestNum" value="" /> | |
| </form> | |
| <body> | |
| <div class="loading-bg"> | |
| <div class="loading"> | |
| <img src="https://style.duolabao.cn/order/img/wxpay/gif.gif" alt=""> | |
| </div> | |
| </div> | |
| <div class="loading-card-bg"> | |
| <div class="loading"> | |
| <img src="https://style.duolabao.cn/order/img/wxpay/card_pay.gif" alt=""> | |
| </div> | |
| </div> | |
| <div class="container"> | |
| <!-- 金额显示栏 --> | |
| <div class="payment db-back-white"> | |
| <div class="payment-cont"> | |
| <span class="cursor-blink"></span> | |
| <p class="payment-cont-word db-float-left">消费金额</p> | |
| <p class="payment-cont-num db-float-right"></p> | |
| <p class="payment-cont-icon db-float-right"><span>¥</span><span id="marker">|</span></p> | |
| </div> | |
| </div> | |
| <!-- 选择优惠券 --> | |
| <ul class="tickets"> | |
| </ul> | |
| <!-- 输入键盘 --> | |
| <div class="keybord-box"> | |
| <div class="support-box"> | |
| <div class="support"></div> | |
| </div> | |
| <table class="keybord db-back-white"> | |
| <tr> | |
| <td name="number" class="border-top">1</td> | |
| <td name="number" class="border-left border-top">2</td> | |
| <td name="number" class="border-left border-top">3</td> | |
| <td class="border-left keybord-back border-top"></td> | |
| </tr> | |
| <tr> | |
| <td name="number" class="border-top">4</td> | |
| <td name="number" class="border-top border-left">5</td> | |
| <td name="number" class="border-top border-left">6</td> | |
| <td class="border-top border-left makesure" id="lastpay" rowspan="3"> | |
| <span>确认</span> | |
| <span>支付</span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td name="number" class="border-top">7</td> | |
| <td name="number" class="border-top border-left">8</td> | |
| <td name="number" class="border-top border-left">9</td> | |
| </tr> | |
| <tr> | |
| <td name="number" class="retract border-top"></td> | |
| <td name="number" class="border-top">0</td> | |
| <td name="number" class="border-top border-left">.</td> | |
| </tr> | |
| </table> | |
| </div> | |
| <div class="recommend-list"> | |
| <div class="recommend-list-hd">微信会员卡享优惠</div> | |
| <div class="recommend-list-con" id="recommend-list-con"> | |
| <ul class="clearfix"></ul> | |
| </div> | |
| <p class="recommend-prompt">办卡成功后自动买单，订单实扣<strong>元</strong>，<span></span></p> | |
| <div class="recommend-list-ht"> | |
| <a href="javascript:;" class="handle-btn">办卡并买单</a> | |
| <a href="javascript:;" class="pay-btn">原价付款</a> | |
| </div> | |
| <p class="disclaimer">商品及服务均由商户提供，与平台无关</p> | |
| </div> | |
| </div> | |
| <!--会员卡支付确认弹框--> | |
| <div class="vip-card-bg"> | |
| <div class="vip-card-box"> | |
| <h3>会员卡支付</h3> | |
| <div class="card-order-box" > | |
| <h4>订单金额</h4> | |
| <p>¥<strong>100</strong></p> | |
| </div> | |
| <ul class="card-order-list" > | |
| <li class="clearfix"> | |
| <span class="fl">会员卡类型</span> | |
| <span class="cardStyle fr">折扣卡</span> | |
| </li> | |
| <li class="clearfix"> | |
| <span class="fl">卡支付金额</span> | |
| <span class="cardPayAmount fr">¥9</span> | |
| </li> | |
| <li class="clearfix"> | |
| <span class="fl">支付后卡余额</span> | |
| <span class="cardPayBalance fr">¥0</span> | |
| </li> | |
| <li class="clearfix"> | |
| <span class="fl">仍需微信支付</span> | |
| <span class="wxPayAmount fr">¥91</span> | |
| </li> | |
| </ul> | |
| <a href="javascript:;" class="card-again-btn" >再次办卡享优惠</a> | |
| <a href="javascript:;" class="vip-card-sureBtn" >确认支付</a> | |
| <b class="vip-card-close" ></b> | |
| </div> | |
| </div> | |
| <!-- 分享券列表弹层 --> | |
| <div class="dialog-bg"></div> | |
| <div class="dialog"> | |
| <div class="dialog-inn"> | |
| <div class="dialog-head"> | |
| <p class="db-float-left">哆券优惠</p> | |
| <p class="db-float-right">共优惠<span>0</span>元</p> | |
| </div> | |
| <ol class="dialog-cont"> | |
| </ol> | |
| <div class="dialog-foot"> | |
| <p class="dialog-foot-sure">确定</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 注册 --> | |
| <div class="register-bg"> | |
| <div class="register-box"> | |
| <h4>充<strong>200</strong>,可享<b>8.5</b>折</h4> | |
| <div class="register-con"> | |
| <form id="login_form" action=""> | |
| <input type="text" class="phoneNum" maxLength="11" value="" placeholder="请输入手机号" /> | |
| <div class="clearfix"> | |
| <input class="vcode fl" type="text" maxLength="4" placeholder="请输入验证码" value="" /> | |
| <a href="javascript:;" class="vcode-btn fr">获取验证码</a> | |
| </div> | |
| </form> | |
| </div> | |
| <div class="error-msg"></div> | |
| <p class="register-prompt">办卡后，自动支付<strong>本次消费元</strong></p> | |
| <div class="register-ft"> | |
| <a class="register-btn" href="javascript:;">确定</a> | |
| </div> | |
| <span class="close-btn"></span> | |
| <div class="agreement">注册即视为您同意 <a href="${param.memberCardBalanceVO.hiCardHost}/card/disclaimer">《会员授权及服务协议》</a></div> | |
| </div> | |
| </div> | |
| <div id="orderError" style="color:#f8f8f8;font-size: 12px"></div> | |
| <!-- =======引用js====== --> | |
| <script type="text/javascript"> | |
| var dlb = { | |
| byName: function (name){ | |
| return document.getElementsByName(name); | |
| }, | |
| byId: function (id){ | |
| return document.getElementById(id); | |
| }, | |
| byQs: function (ele){ | |
| return document.querySelector(ele); | |
| }, | |
| byQsa: function (eles){ | |
| return document.querySelectorAll(eles); | |
| }, | |
| show: function(obj){ | |
| obj.style.display = 'block'; | |
| }, | |
| hide: function(obj){ | |
| obj.style.display = 'none'; | |
| }, | |
| //判断是否是整数 | |
| isInt: function(num){ | |
| if(num % 1 == 0){ | |
| return parseInt(num); | |
| }else{ | |
| var result = num%1, | |
| strResult = String(result.toFixed(2)); | |
| if(strResult[strResult.length - 1] == '0'){ | |
| return Number(num).toFixed(1); | |
| }else{ | |
| return Number(num).toFixed(2); | |
| } | |
| } | |
| }, | |
| //事件监听 | |
| addEvent: function (obj, sEv, fn) { | |
| if (obj.addEventListener) { | |
| obj.addEventListener(sEv, fn, false); | |
| } else { | |
| obj.attachEvent('on' + sEv, fn); | |
| } | |
| }, | |
| removeEvent: function (obj, sEv, fn) { | |
| if (obj.removeEventListener) { | |
| obj.removeEventListener(sEv, fn, false); | |
| } else { | |
| obj.detachEvent('on' + sEv, fn); | |
| } | |
| }, | |
| //增加className | |
| addClass: function (obj,sClass){ | |
| if(obj.className){ | |
| var reg = new RegExp('\\b'+sClass+'\\b','g'); | |
| if(obj.className.search(reg) == -1){ | |
| obj.className += ' '+sClass; | |
| } | |
| }else{ | |
| obj.className = sClass; | |
| } | |
| }, | |
| //删除className | |
| removeClass: function (obj,sClass){ | |
| if(obj.className){ | |
| var reg = new RegExp('\\b'+sClass+'\\b','g'); | |
| if(obj.className.search(reg) != -1){ | |
| obj.className = obj.className.replace(reg,'').replace(/^\s+|\s+$/,' ').replace(/\s+/g,' '); | |
| if(!obj.className){ | |
| obj.removeAttribute("class"); | |
| } | |
| } | |
| } | |
| }, | |
| //查看是否有这个class名，有就返回true否则返回false | |
| hasClass: function (obj, cls){ | |
| var obj_class = obj.className, //获取 class 内容. | |
| obj_class_lst = obj_class.split(/\s+/); //通过split空字符将cls转换成数组. | |
| var x = 0; | |
| for(x in obj_class_lst) { | |
| if(obj_class_lst[x] == cls) { //循环数组, 判断是否包含cls | |
| return true; | |
| } | |
| } | |
| return false; | |
| }, | |
| //清除所有iclass | |
| clear: function(item,iclass){ | |
| for(var i=0;i<item.length;i++){ | |
| dlb.removeClass(item[i],iclass); | |
| } | |
| }, | |
| //ajax函数 封装 | |
| json2url: function (json){ | |
| var arr = []; | |
| for(var name in json){ | |
| arr.push(name+'='+encodeURIComponent(json[name])); | |
| } | |
| return arr.join('&'); | |
| }, | |
| ajax: function (json){ | |
| var timer=null; | |
| json = json||{}; | |
| if(!json.url)return; | |
| json.data = json.data||{}; | |
| json.type = json.type||'get'; | |
| json.timeout = json.timeout||8000; | |
| if(window.XMLHttpRequest){ | |
| var oAjax = new XMLHttpRequest(); | |
| }else{ | |
| var oAjax = new ActiveXObject('Microsoft.XMLHTTP'); | |
| } | |
| switch(json.type.toLowerCase()){ | |
| case 'get': | |
| oAjax.open('GET',json.url+'?'+dlb.json2url(json.data),true); | |
| oAjax.send(); | |
| break; | |
| case 'post': | |
| oAjax.open('POST',json.url,true); | |
| oAjax.setRequestHeader('Content-type','application/x-www-form-urlencoded'); | |
| oAjax.send(dlb.json2url(json.data)); | |
| break; | |
| } | |
| oAjax.onreadystatechange=function(){ | |
| if(oAjax.readyState==4){ | |
| clearTimeout(timer); | |
| if(oAjax.status>=200&&oAjax.status<300||oAjax.status==304){ | |
| json.success&&json.success(oAjax.responseText); | |
| }else{ | |
| json.error&&json.error(oAjax.status); | |
| } | |
| } | |
| timer=setTimeout(function(){ | |
| if(oAjax.readyState!=4){ | |
| clearTimeout(timer); | |
| json.error&&json.error(); | |
| } | |
| },json.timeout); | |
| }; | |
| }, | |
| jsonp: function (json){ | |
| json = json || {}; | |
| if(!json.url)return; | |
| json.cbName = json.cbName||'cb'; | |
| json.data = json.data||{}; | |
| json.data[json.cbName] = 'show'+Math.random(); | |
| json.data[json.cbName] = json.data[json.cbName].replace('.',''); | |
| var arr = []; | |
| for(var i in json.data){ | |
| arr.push(i+'='+encodeURIComponent(json.data[i])); | |
| } | |
| var str = arr.join('&'); | |
| window[json.data[json.cbName]]=function(result){ | |
| json.success&&json.success(result); | |
| oH.removeChild(oS); | |
| window[json.data[json.cbName]]=null; | |
| }; | |
| var oH = document.getElementsByTagName('head')[0]; | |
| var oS = document.createElement('script'); | |
| oS.src=json.url+'?'+str; | |
| oH.appendChild(oS); | |
| oS.onerror = function(){ | |
| window[json.data[json.cbName]]=null; | |
| oH.removeChild(oS); | |
| json.error&&json.error(); | |
| } | |
| } | |
| } | |
| // 错误提示弹框插件 | |
| var pop = { | |
| oBox: document.createElement('div'), | |
| oPos: document.createElement('div'), | |
| oT: document.createElement('p'), | |
| oBtn: document.createElement('a'), | |
| init: function(){ | |
| var _this = this; | |
| this.oBtn.innerHTML = '确定'; | |
| dlb.addClass(_this.oBox,'error-dialog-box'); | |
| dlb.addClass(_this.oPos,'error-dialog'); | |
| dlb.addClass(_this.oBtn,'close-dialog-btn'); | |
| this.oPos.appendChild(this.oT); | |
| this.oPos.appendChild(this.oBtn); | |
| this.oBox.appendChild(this.oPos); | |
| this.oBtn.onclick = function(){ | |
| _this.hide(); | |
| } | |
| }, | |
| show: function(){ | |
| var _this = this; | |
| this.init(); | |
| dlb.byQs('body').appendChild(_this.oBox); | |
| }, | |
| hide: function(){ | |
| var _this = this; | |
| this.oT.innerHTML = ''; | |
| dlb.byQs('body').removeChild(_this.oBox); | |
| }, | |
| alert: function(msg){ | |
| if(!msg) return; | |
| this.oT.innerHTML = msg; | |
| this.show(); | |
| } | |
| }; | |
| // 支付错误提示 | |
| window.onerror = function (msg, url, line) { | |
| var error_text = 'ERR: ' + msg + '<br />' + url + '<br />' + line; | |
| error_text += '<p>' + navigator.userAgent + '</p>' | |
| dlb.byId('orderError').style.color = '#f8f8f8'; | |
| dlb.byId('orderError').innerHTML = error_text; | |
| } | |
| //提交金额执行函数 | |
| function commit(){ | |
| var oAmount = dlb.byId('amount'); | |
| var oCashedNum = dlb.byId('cashedNum'); | |
| var oPayForm = dlb.byId('payForm'); | |
| if(parseFloat(oAmount.value) > 0){ | |
| dlb.removeEvent(dlb.byQs('#lastpay'),'touchend',commit); | |
| // dlb.byId("lastpay").style.backgroundColor = "#d7d3d4"; | |
| dlb.removeClass(dlb.byId("lastpay"),"canClick"); | |
| // 判断如果选中的是哆卡就让走card系统 | |
| var oRadioSelected = dlb.byQs('.radio-selected'); | |
| if(oRadioSelected && dlb.hasClass(oRadioSelected,'stored-card')){ | |
| dlb.byQs('#cardPay').value = "CARD_PAY"; | |
| if(dlb.hasClass(oRadioSelected,'cardholder') || dlb.hasClass(oRadioSelected,'changeSendCard')){ | |
| discountAmount(); | |
| dlb.show(dlb.byQs('.vip-card-bg')); | |
| }else{ | |
| loadingShow(); | |
| ajaxSubmitForm(); | |
| } | |
| }else if(dlb.byId('cardKindNum').value){ | |
| loadingShow(); | |
| dlb.byQs('#cardPay').value = "CARD_PAY"; | |
| ajaxSubmitForm(); | |
| }else{ | |
| loadingShow(); | |
| dlb.byQs('#cardPay').value = ''; | |
| ajaxSubmitForm(); | |
| } | |
| }else{ | |
| return false; | |
| } | |
| } | |
| // 加载图片的显示隐藏 | |
| function loadingShow(type){ | |
| var oLoading = type == 'card' ? dlb.byQs('.loading-card-bg') : dlb.byQs('.loading-bg'); | |
| dlb.show(oLoading); | |
| oLoading.style.animation = 'mymove 2s'; | |
| } | |
| function loadingHide(){ | |
| var oLoading = dlb.byQs('.loading-bg'); | |
| var cLoading = dlb.byQs('.loading-card-bg'); | |
| dlb.hide(oLoading); | |
| dlb.hide(cLoading); | |
| oLoading.style.animation = ''; | |
| cLoading.style.animation = ''; | |
| } | |
| //设置弹框的高度 | |
| function setQuickHeight(){ | |
| var wh = window.innerHeight; | |
| var dh = dlb.byQs('.dialog-head').offsetHeight; | |
| var df = dlb.byQs('.dialog-foot').offsetHeight; | |
| var dt = dlb.byQs('.dialog').offsetTop; | |
| var realH = wh - dh - df - dt*2 - 16; | |
| dlb.byQs('.dialog-cont').style.height = realH + "px"; | |
| } | |
| </script> | |
| <script type="text/javascript"> | |
| //注册页面 | |
| // 监听关闭按钮点击事件 | |
| dlb.addEvent(dlb.byQs(".close-btn"),'click',function(){ | |
| dlb.byQs(".phoneNum").value = ''; | |
| dlb.byQs(".vcode").value = ''; | |
| dlb.byQs(".error-msg").innerHTML = ""; | |
| dlb.hide(dlb.byQs(".register-bg")); | |
| //监听立即办理按钮点击事件 | |
| dlb.addEvent(dlb.byQs(".handle-btn"),"touchend",pay); | |
| }) | |
| // 监听获取验证码按钮点击事件 | |
| dlb.addEvent(dlb.byQs(".vcode-btn"),'click',sendCode); | |
| function sendCode() { | |
| if(checkPhoneNum()) { | |
| dlb.removeEvent(dlb.byQs(".vcode-btn"),'click',sendCode); | |
| dlb.addClass(dlb.byQs(".vcode-btn"),'disabled-btn'); | |
| sendAuthCode2(dlb.byQs(".phoneNum").value, 'login'); | |
| } | |
| } | |
| /*-------------------------------------------*/ | |
| var InterValObj; //timer变量，控制时间 | |
| var curCount = 60; //当前剩余秒数 | |
| var code = ""; //验证码 | |
| var codeLength = 4; //验证码长度 | |
| function sendAuthCode2(mobilePhone,type) { | |
| SetRemainTime(); | |
| InterValObj = setInterval(SetRemainTime, 1000); //启动计时器，1秒执行一次 | |
| sendAuthCodeX(mobilePhone,type); | |
| } | |
| //timer处理函数 | |
| function SetRemainTime(){ | |
| curCount--; | |
| //设置button效果，开始计时 | |
| dlb.byQs(".vcode-btn").innerHTML = curCount + " s"; | |
| if (curCount == 0) { | |
| clearInterval(InterValObj);//停止计时器 | |
| dlb.addEvent(dlb.byQs(".vcode-btn"),'click',sendCode);//启用按钮 | |
| dlb.byQs(".vcode-btn").innerHTML = "获取验证码"; | |
| dlb.removeClass(dlb.byQs(".vcode-btn"),'disabled-btn'); | |
| curCount = 60; | |
| code = ""; //清除验证码。如果不清除，过时间后，输入收到的验证码依然有效 | |
| } | |
| } | |
| //调取后台短信接口 | |
| function sendAuthCodeX(mobilePhone,type){ | |
| var host = '${param.memberCardBalanceVO.hiCardHost}'; | |
| dlb.jsonp({ | |
| url: host+'/card/account/member/verifycode/jsonp/'+mobilePhone+'/'+type, | |
| success: function (json) { | |
| //获取验证码失败，但是定时器还大于25秒，也没有走完的情况下每隔20秒自动调取一次 | |
| if(json.result !== 'success' && curCount > 25 && curCount != 60){ | |
| setTimeout(function(){ | |
| sendAuthCodeX(mobilePhone,type); | |
| },20000); | |
| } | |
| }, | |
| error: function(){ | |
| dlb.byQs(".error-msg").innerHTML = "系统错误请重试"; | |
| clearInterval(InterValObj);//停止计时器 | |
| dlb.addEvent(dlb.byQs(".vcode-btn"),'click',sendCode);//启用按钮 | |
| dlb.byQs(".vcode-btn").innerHTML = "获取验证码"; | |
| dlb.removeClass(dlb.byQs(".vcode-btn"),'disabled-btn'); | |
| curCount = 60; | |
| code = ""; //清除验证码。如果不清除，过时间后，输入收到的验证码依然有效 | |
| } | |
| }); | |
| } | |
| // 校验手机号 | |
| function checkPhoneNum(){ | |
| if(dlb.byQs(".phoneNum").value == ''){ | |
| dlb.byQs(".error-msg").innerHTML = "请输入手机号码"; | |
| return false; | |
| }else if(!(/^1[34578]\d{9}$/i).test(dlb.byQs(".phoneNum").value)){ | |
| dlb.byQs(".error-msg").innerHTML = "请输入正确手机号码"; | |
| return false; | |
| }else{ | |
| dlb.byQs(".error-msg").innerHTML = ""; | |
| return true; | |
| } | |
| } | |
| dlb.byQs(".phoneNum").oninput = checkPhoneNum; | |
| // 校验验证码 | |
| function checkCode(){ | |
| if(dlb.byQs(".vcode").value == ''){ | |
| dlb.byQs(".error-msg").innerHTML = "请输入验证码"; | |
| return false; | |
| }else if(!(/^\d{4}$/i).test(dlb.byQs(".vcode").value)){ | |
| dlb.byQs(".error-msg").innerHTML = "验证码为4位数字"; | |
| return false; | |
| }else{ | |
| dlb.byQs(".error-msg").innerHTML = ""; | |
| return true; | |
| } | |
| } | |
| dlb.byQs(".vcode").oninput = checkCode; | |
| //点击确定按钮 先验证 | |
| dlb.addEvent(dlb.byQs(".register-btn"),'click',loginSubmit); | |
| function loginSubmit(){ | |
| if(checkPhoneNum() && checkCode()){ | |
| dlb.removeEvent(dlb.byQs(".register-btn"),'click',loginSubmit); | |
| dlb.addClass(dlb.byQs(".register-btn"),'disabled-btn'); | |
| var host = '${param.memberCardBalanceVO.hiCardHost}'; | |
| dlb.jsonp({ | |
| url: host+'/card/member/valid/'+dlb.byQs(".phoneNum").value+'/login/'+dlb.byQs(".vcode").value, | |
| success: function(json){ | |
| if(json.result == 'success'){ | |
| register(); | |
| }else{ | |
| dlb.byQs(".error-msg").innerHTML = "验证码错误！"; | |
| reductionState(); | |
| } | |
| }, | |
| error: function(){ | |
| dlb.byQs(".error-msg").innerHTML = "系统错误，请重试！"; | |
| reductionState(); | |
| } | |
| }); | |
| } | |
| } | |
| //注册方法 | |
| function register(){ | |
| var memberNum = dlb.byId('memberNum').value; | |
| var host = '${param.memberCardBalanceVO.hiCardHost}'; | |
| dlb.jsonp({ | |
| url: host + '/card/member/regist/'+memberNum+'/'+dlb.byQs(".phoneNum").value, | |
| success: function(json){ | |
| if(json.result == 'success'){ | |
| //百度统计 | |
| _hmt && _hmt.push(['_trackEvent', 'M06', 'click', '注册成功']); | |
| dlb.hide(dlb.byQs(".register-bg")); | |
| commit(); | |
| }else{ | |
| dlb.byQs(".error-msg").innerHTML = "注册失败，请重试！"; | |
| reductionState(); | |
| } | |
| }, | |
| error: function(){ | |
| dlb.byQs(".error-msg").innerHTML = "系统错误，请重试！"; | |
| reductionState(); | |
| } | |
| }) | |
| } | |
| function reductionState(){ | |
| clearInterval(InterValObj);//停止计时器 | |
| dlb.addEvent(dlb.byQs(".vcode-btn"),'click',sendCode);//启用按钮 | |
| dlb.removeClass(dlb.byQs(".vcode-btn"),'disabled-btn'); | |
| dlb.byQs(".vcode-btn").innerHTML = "获取验证码"; | |
| curCount = 60; | |
| dlb.addEvent(dlb.byQs(".register-btn"),'click',loginSubmit); | |
| dlb.removeClass(dlb.byQs(".register-btn"),'disabled-btn'); | |
| } | |
| </script> | |
| <script type="text/javascript"> | |
| 'use strict' | |
| // 默认选择谁 | |
| defaultSel(); | |
| //判断立减是否存在并且给立减活动绑定点击事件 | |
| if(dlb.byQs('.tickets-existed')){ | |
| var oTicketsNum = dlb.byQs(".tickets-existed input").value; | |
| dlb.addEvent(dlb.byQs('.tickets-detial'),'click',function(){ | |
| clearRadio(); | |
| dlb.addClass(dlb.byQs('.tickets-detial'),'radio-selected'); | |
| if(dlb.byQs('.voucher-existed')){ | |
| var oDisAmount = dlb.byQs('.dialog-head span'); | |
| contrast(); //控制显示是否有可用的优惠券 | |
| checkCoupon(); //循环查看看可用的优惠券 | |
| dlb.clear(dlb.byQsa('.quick-list'),'quick-chiose'); //清除选中的代金券 | |
| oDisAmount.innerHTML = '0'; | |
| dlb.byId('cashedNum').value = oTicketsNum; | |
| } | |
| if(dlb.byQs(".stored-card")){ | |
| clearAmount(); //清除哆卡的折扣金额和实际金额 | |
| } | |
| }); | |
| } | |
| //判断默认选中哆卡还是立减 | |
| function defaultSel(){ | |
| var oStoredCard = dlb.byQs('.stored-card'); | |
| var oTicketsExisted = dlb.byQs('.tickets-existed'); | |
| if(oStoredCard){ | |
| clearRadio(); //清除所有选中 | |
| dlb.addClass(oStoredCard,'radio-selected'); | |
| }else if(!oStoredCard && oTicketsExisted){ | |
| clearRadio(); //清除所有选中 | |
| dlb.addClass(oTicketsExisted,'radio-selected'); | |
| }else{ | |
| clearRadio(); | |
| } | |
| }; | |
| //清空所选中单选按钮 | |
| function clearRadio(){ | |
| var aRadio = dlb.byQsa('.tickets li'); | |
| if(aRadio.length){ | |
| for(var i=0,aR=aRadio.length;i<aR;i++){ | |
| dlb.removeClass(aRadio[i],'radio-selected'); | |
| } | |
| } | |
| } | |
| </script> | |
| <script type="text/javascript"> | |
| //判断事件的绑定 | |
| function judgeEvent(){ | |
| if(dlb.byQs(".recommend-list-con li")){ | |
| //监听立即办理按钮点击事件 | |
| dlb.addEvent(dlb.byQs(".handle-btn"),"touchend",pay); | |
| //监听原价付款按钮点击事件 | |
| dlb.addEvent(dlb.byQs(".pay-btn"),"touchend",directPay); | |
| } | |
| if(dlb.byId('cardKindList').value != '' && !dlb.byQs(".voucher-detial") && !dlb.byQs(".tickets-detial")){ | |
| dlb.addEvent(dlb.byId('lastpay'),'touchend',cardKindShow); | |
| }else{ | |
| dlb.addEvent(dlb.byId('lastpay'),'touchend',commit); | |
| } | |
| } | |
| // 异步提交表单 | |
| function ajaxSubmitForm(){ | |
| var orderAmount = dlb.byId('amount').value, | |
| customerNum = dlb.byId('customerNum').value, | |
| shopNum = dlb.byId('shopNum').value, | |
| machineNum = dlb.byId('machineNum').value, | |
| memberNum = dlb.byId('memberNum').value, | |
| source = dlb.byId('source').value, | |
| tableNum = dlb.byId('tableNum').value, | |
| openId = dlb.byId('openId').value, | |
| authId = dlb.byId('authId').value, | |
| voucherNum = dlb.byId('cashedNum').value, | |
| requestNum = dlb.byId('requestNum').value, | |
| payWay = dlb.byId('payWay').value, | |
| cardPay = dlb.byId('cardPay').value, | |
| onceCardBlackNum = dlb.byId('onceCardBlackNum').value, | |
| cardKindNum = dlb.byId('cardKindNum').value, | |
| cardAgainFlag = dlb.byId('cardAgainFlag').value; | |
| //如果选立减活动类型传立减 | |
| var oRadioSelected = dlb.byQs('.radio-selected'); | |
| var oT = dlb.byQs('.tickets-detial'); | |
| var marketingType = null; | |
| if(oRadioSelected && oT){ | |
| if(dlb.hasClass(oT,'radio-selected')){ | |
| marketingType = 'REDUCE'; | |
| } | |
| } | |
| dlb.ajax({ | |
| url: '/active/pay/', | |
| type: 'POST', | |
| data: {"authId":authId,"orderAmount":orderAmount,"customerNum":customerNum,"shopNum":shopNum,"machineNum":machineNum,"memberNum":memberNum,"source":source,"tableNum":tableNum,"openId":openId,"voucherNum":voucherNum,"requestNum":requestNum,"payWay":payWay,"marketingType":marketingType,"cardPay":cardPay,"onceCardBlackNum":onceCardBlackNum,"cardKindNum":cardKindNum,"cardAgainFlag":cardAgainFlag}, | |
| success: function(str){ | |
| var jsonObj = JSON.parse(str); | |
| if(jsonObj.result == "success"){ | |
| var orderNum = jsonObj.data.orderNum; | |
| dlb.byId("orderNum").value = orderNum; | |
| var bankrequest = jsonObj.data.bankRequest; | |
| if(!bankrequest){ | |
| loadingHide(); | |
| pop.alert('操作过于频繁，请再次点击确认支付按钮'); | |
| dlb.addClass(dlb.byQs('#lastpay'),"canClick"); | |
| judgeEvent(); | |
| return; | |
| } | |
| //dlb.byId("requestNum").value = jsonObj.data.bankRequestNum; | |
| if(bankrequest.status == '0' && bankrequest.payUrl != ''){ | |
| if(cardAgainFlag == 1){ | |
| var buyCardForm = dlb.byId('buyCard'); | |
| buyCardForm.setAttribute('action',bankrequest.payUrl); | |
| dlb.byId('cardAgainBankRequestNum').value=jsonObj.data.bankRequestNum; | |
| buyCardForm.submit() | |
| return; | |
| } | |
| window.location.href = bankrequest.payUrl; | |
| return; | |
| } | |
| if(bankrequest.status == '1'){ | |
| dlb.byId("requestNum").value = bankrequest.requestNum; | |
| if(dlb.byId("machineForBuyingCard").value != dlb.byId("machineNum").value) { | |
| dlb.byId("machineNum").value = dlb.byId("machineForCardPay").value; | |
| } | |
| bankPay(); | |
| return; | |
| } | |
| onBridgeReady(bankrequest.APPID,bankrequest.TIMESTAMP,bankrequest.NONCESTR,bankrequest.PACKAGE,bankrequest.PAYSIGN); | |
| loadingHide(); | |
| }else{ | |
| loadingHide(); | |
| pop.alert(jsonObj.error.errorMsg); | |
| dlb.addClass(dlb.byQs('#lastpay'),"canClick"); | |
| judgeEvent(); | |
| } | |
| }, | |
| error: function(error){ | |
| loadingHide(); | |
| pop.alert('系统异常，请稍后重试'); | |
| dlb.addClass(dlb.byQs('#lastpay'),"canClick"); | |
| judgeEvent(); | |
| } | |
| }); | |
| } | |
| function bankPay(){ | |
| var orderNum = dlb.byId("orderNum").value; | |
| var machineNum = dlb.byId("machineNum").value; | |
| var requestNum = dlb.byId("requestNum").value; | |
| var customerNum = dlb.byId("customerNum").value; | |
| location.replace("http://order.duolabao.cn/active/complete/"+orderNum+"/?machineNum="+machineNum+"&requestNum="+requestNum+"&customerNum="+customerNum+"&r="+new Date().getTime()); | |
| event.returnValue=false; | |
| } | |
| function onBridgeReady(appId,time,nonceStr,package,paySign){ | |
| function onJSBridgeReady(){ | |
| loadingHide(); | |
| WeixinJSBridge.invoke( | |
| 'getBrandWCPayRequest', { | |
| "appId":appId, | |
| "timeStamp":time, | |
| "nonceStr": nonceStr, | |
| "package":package, | |
| "signType": "MD5", | |
| "paySign":paySign | |
| }, | |
| function(res){ | |
| if(res.err_msg == "get_brand_wcpay_request:ok" ) { | |
| bankPay(); | |
| }else{ | |
| dlb.addClass(dlb.byQs('#lastpay'),"canClick"); | |
| judgeEvent(); | |
| } | |
| } | |
| ); | |
| } | |
| if (typeof WeixinJSBridge == "undefined"){ | |
| loadingShow(); | |
| if( document.addEventListener ){ | |
| document.addEventListener('WeixinJSBridgeReady', onJSBridgeReady, false); | |
| }else if (document.attachEvent){ | |
| document.attachEvent('WeixinJSBridgeReady', onJSBridgeReady); | |
| document.attachEvent('onWeixinJSBridgeReady', onJSBridgeReady); | |
| } | |
| }else{ | |
| onJSBridgeReady(); | |
| } | |
| } | |
| </script> | |
| <script type="text/javascript"> | |
| var keybord = { | |
| //获取键盘内容 | |
| getCon: function(obj){ | |
| return obj.innerHTML; | |
| }, | |
| //触摸键盘时颜色改变 | |
| changeBc: function(obj){ | |
| obj.style.backgroundColor = '#eee'; | |
| var _obj = obj; | |
| setTimeout(function(){ | |
| _obj.style.backgroundColor = '#fff'; | |
| },30); | |
| }, | |
| //键盘收起 | |
| slideDown: function(box){ | |
| var oF = box.offsetHeight; | |
| var timer = null; | |
| var h = 0; | |
| timer = setInterval(function(){ | |
| h+=10; | |
| if(h >= oF){ | |
| h = oF; | |
| clearInterval(timer); | |
| } | |
| box.parentNode.style.bottom = -h+'px'; | |
| },5); | |
| }, | |
| //键盘弹出 | |
| slideUp: function(box,pos){ | |
| var oF = box.offsetHeight; | |
| var timer = null; | |
| var h = -oF; | |
| timer = setInterval(function(){ | |
| h+=10; | |
| if(h >= 0 ){ | |
| h = 0; | |
| clearInterval(timer); | |
| } | |
| box.parentNode.style.bottom = h+'px'; | |
| },5); | |
| dlb.removeEvent(pos,'click',toUp); | |
| }, | |
| //键盘点击输入 | |
| input: function(am,item){ | |
| var num = keybord.getCon(item); | |
| var newAm; | |
| //判断输入金额在小数点前五位、小数点后两位 | |
| if ((am == null || am == '') && num == '.'){ | |
| newAm = "0" + num; | |
| }else if (am == null || am == ''){ | |
| newAm = num; | |
| }else if (num == '.' && am.indexOf(".") > 0){ | |
| newAm = am; | |
| }else if (num == '0' && am.indexOf(".") < 0 && am.indexOf("0") == 0){ | |
| newAm = am; | |
| }else if (num == '.' && am.indexOf(".") < 0 && parseInt(am) < 50000){ | |
| newAm = am + num; | |
| }else if (am.indexOf(".") > 0 && (am.length - am.indexOf(".")) > 2){ | |
| newAm = am; | |
| }else if (am.length > 8){ | |
| newAm = am; | |
| }else if (am == '0' && num != '.'){ | |
| newAm = num; | |
| }else if (am.indexOf(".") < 0 && parseInt(am) == 5000 && num != '0'){ | |
| newAm = am; | |
| }else if (am.indexOf(".") < 0 && parseInt(am) > 5000){ | |
| newAm = am; | |
| }else if (am.indexOf(".") < 0 && parseInt(am) <= 50000 && am.length >= 5 && num != '.'){ | |
| newAm = am; | |
| }else{ | |
| newAm = am + num; | |
| } | |
| return newAm; | |
| }, | |
| //点击退格 | |
| back: function(aM){ | |
| if(!aM){ | |
| return; | |
| }else{ | |
| return aM.substring(0, aM.length - 1); | |
| } | |
| } | |
| } | |
| //光标调用 | |
| setInterval(markBlink(), 580); | |
| //初始化金额 | |
| dlb.byQs('.payment-cont-num').innerHTML = ''; | |
| dlb.byId("amount").value = ''; | |
| //监听触摸键盘事件 | |
| var oBack = dlb.byQs('.keybord-back'); | |
| for (var i = 0; i < dlb.byName('number').length; i++) { | |
| //键盘触摸的时候颜色变化 | |
| dlb.addEvent(dlb.byName('number')[i],'touchstart',function(e){ | |
| keybord.changeBc(this); | |
| e.preventDefault(); | |
| }) | |
| //键盘触摸抬起的时候输入值 | |
| dlb.addEvent(dlb.byName('number')[i], 'touchend', inputing); | |
| } | |
| //按下退格键颜色变化 | |
| dlb.addEvent(dlb.byQs('.keybord-back'),'touchstart',function(e){ | |
| keybord.changeBc(this); | |
| e.preventDefault(); | |
| }); | |
| //按下退格按钮 | |
| dlb.addEvent(dlb.byQs('.keybord-back'), 'touchend', backClick); | |
| //当页面文档加载完成之后弹出键盘 | |
| dlb.addEvent(document, 'DOMContentLoaded', toUp); | |
| //点击确认支付 | |
| var oMakesure = dlb.byId('lastpay'); | |
| if(dlb.byId('cardKindList').value != '' && !dlb.byQs(".voucher-detial") && !dlb.byQs(".tickets-detial")){ | |
| dlb.addEvent(dlb.byId('lastpay'),'touchend',cardKindShow); | |
| }else{ | |
| dlb.addEvent(dlb.byId('lastpay'),'touchend',commit); | |
| } | |
| //键盘收起按钮按下颜色变化 | |
| dlb.addEvent(dlb.byQs('.retract'),'touchstart',function(e){ | |
| keybord.changeBc(this); | |
| e.preventDefault(); | |
| }); | |
| //点击键盘收起按钮，键盘收起 | |
| dlb.addEvent(dlb.byQs('.retract'),'touchend',function(){ | |
| keybord.slideDown(dlb.byQs('.keybord')); | |
| dlb.addEvent(dlb.byQs('.payment-cont'),'click',toUp); | |
| }); | |
| //键盘弹出函数 | |
| function toUp(){ | |
| if(dlb.byQs('.recommend-list') && parseInt(dlb.byQs('.recommend-list').style.bottom) == 0){ | |
| recommend.toHide(dlb.byQs('.recommend-list')); | |
| } | |
| keybord.slideUp(dlb.byQs('.keybord'),dlb.byQs('.payment-cont')); | |
| speFunEnd(); | |
| } | |
| //输入金额函数 | |
| function inputing(e) { | |
| var oPayNum = dlb.byQs('.payment-cont-num'); | |
| var amount = dlb.byId("amount").value; | |
| var oVoucherExisted = dlb.byQs('.voucher-existed'); | |
| var num = this.innerHTML; | |
| var newAmount = keybord.input(amount,this) | |
| dlb.byId("amount").value = newAmount; | |
| oPayNum.innerHTML = newAmount; | |
| speFunOpen(); | |
| //输入的时候判断是否有可用优惠券 | |
| if(parseFloat(amount) != parseFloat(newAmount)){ | |
| //假如优惠券存在有两种情况 一、没有选中优惠券 二、已经选中了优惠券 | |
| if(oVoucherExisted){ | |
| if(dlb.hasClass(oVoucherExisted,'radio-selected')){ | |
| dlb.clear(dlb.byQsa('.quick-list'),'quick-chiose'); //清空选中的优惠券 | |
| contrast(); //控制显示是否有可用的优惠券 | |
| defaultSel(); //默认选择哆卡还是立减 | |
| //isSelected(); //把优惠券的优惠金额做更改 | |
| }else{ | |
| dlb.clear(dlb.byQsa('.quick-list'),'quick-chiose'); //清空选中的优惠券 | |
| contrast(); //控制显示是否有可用的优惠券 | |
| } | |
| } | |
| } | |
| e.preventDefault(); | |
| if(dlb.byQs(".stored-card")){ | |
| isSelectedCard(); //判断哆卡是否被选中是否显示金额 | |
| } | |
| } | |
| //按下退格键函数 | |
| function backClick(e){ | |
| var amount = dlb.byId("amount").value; | |
| var aVoucherList = dlb.byQsa('.dialog-cont li'); | |
| var oDisAmount = dlb.byQs('.dialog-head span'); | |
| var oSelected = dlb.byQs('.quick-chiose'); | |
| var newAmount; | |
| if (amount == null || amount == '') { | |
| return; | |
| } else { | |
| newAmount = amount.substring(0, amount.length - 1); | |
| } | |
| dlb.byId("amount").value = newAmount; | |
| dlb.byQs('.payment-cont-num').innerHTML = newAmount; | |
| oDisAmount.innerHTML = '0'; | |
| if(dlb.byQs('.voucher-existed')){ | |
| clearVoucherShow(); | |
| contrast(); //显示是否有可用的优惠券 | |
| autoJudge(); //自动判断金额是否小于代金券金额 | |
| checkCoupon(); //循环查看可用的代金券 | |
| } | |
| //按下空格分两种情况 一、已经选中了优惠券 二、没有选中优惠券 | |
| if(oSelected){ | |
| isSelected(); //判断是否选中代金券 | |
| }else{ | |
| if(dlb.byQs(".stored-card")){ | |
| isSelectedCard(); //判断哆卡是否被选中是否显示金额 | |
| } | |
| } | |
| speFunEnd(); //输入金额临界值触发的事件 | |
| e.preventDefault(); | |
| } | |
| //光标闪烁 | |
| function markBlink() { | |
| var n = 1; | |
| function inner() { | |
| if (n % 2 == 0) { | |
| dlb.byId("marker").style.color = "#333333"; | |
| } else { | |
| dlb.byId("marker").style.color = "#ffffff"; | |
| } | |
| return n++; | |
| } | |
| return inner; | |
| } | |
| //输入金额临界值触发的事件 | |
| function speFunOpen(){ | |
| dlb.byId("marker").style.display = "none"; | |
| if(parseFloat(dlb.byId("amount").value)){ | |
| dlb.addClass(dlb.byId("lastpay"),"canClick"); | |
| } | |
| } | |
| function speFunEnd(){ | |
| if (parseFloat(dlb.byId("amount").value) == 0) { | |
| dlb.removeClass(dlb.byId("lastpay"),"canClick"); | |
| }else if(dlb.byId("amount").value == ''){ | |
| dlb.byId("marker").style.display = "block"; | |
| dlb.removeClass(dlb.byId("lastpay"),"canClick"); | |
| } | |
| } | |
| </script> | |
| <script> | |
| (function() { | |
| var hm = document.createElement("script"); | |
| hm.src = "//hm.baidu.com/hm.js?6a76604a1b6599c0e1e3a00098457333"; | |
| var s = document.getElementsByTagName("script")[0]; | |
| s.parentNode.insertBefore(hm, s); | |
| })(); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment