|  | @@ -0,0 +1,142 @@
 | 
	
		
			
				|  |  | +<!DOCTYPE html>
 | 
	
		
			
				|  |  | +<html>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +<head>
 | 
	
		
			
				|  |  | +    <meta charset="utf-8">
 | 
	
		
			
				|  |  | +    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
 | 
	
		
			
				|  |  | +    <title>精美时尚</title>
 | 
	
		
			
				|  |  | +<link href="css/global.css?v=099b487e" rel="stylesheet"><link href="css/pay.css?v=099b487e" rel="stylesheet"></head>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +<body>
 | 
	
		
			
				|  |  | +    <div class="container">
 | 
	
		
			
				|  |  | +        <div class="novip-card"></div>
 | 
	
		
			
				|  |  | +        <div class="payform">
 | 
	
		
			
				|  |  | +            <dl>
 | 
	
		
			
				|  |  | +                <dt>确认会员手机号</dt>
 | 
	
		
			
				|  |  | +                <dd>
 | 
	
		
			
				|  |  | +                    <input type="number" id="mobile"/>
 | 
	
		
			
				|  |  | +                    <input type="hidden" id="open" value="1"/>
 | 
	
		
			
				|  |  | +                </dd>
 | 
	
		
			
				|  |  | +            </dl>
 | 
	
		
			
				|  |  | +            <dl>
 | 
	
		
			
				|  |  | +                <dt>选择开通时长</dt>
 | 
	
		
			
				|  |  | +                <dd id="package">
 | 
	
		
			
				|  |  | +                    <div class="time-option active" data-price="100" data-package="1">
 | 
	
		
			
				|  |  | +                        <span>1个月<i></i></span>
 | 
	
		
			
				|  |  | +                        <span><i>¥</i><b>100</b>¥180</span>
 | 
	
		
			
				|  |  | +                    </div>
 | 
	
		
			
				|  |  | +                    <div class="time-option" data-price="200" data-package="2">
 | 
	
		
			
				|  |  | +                        <span>6个月</span>
 | 
	
		
			
				|  |  | +                        <span><i>¥</i><b>200</b>¥180</span>
 | 
	
		
			
				|  |  | +                    </div>
 | 
	
		
			
				|  |  | +                    <div class="time-option" data-price="300" data-package="3">
 | 
	
		
			
				|  |  | +                        <span>1年</span>
 | 
	
		
			
				|  |  | +                        <span><i>¥</i><b>300</b>¥180</span>
 | 
	
		
			
				|  |  | +                    </div>
 | 
	
		
			
				|  |  | +                </dd>
 | 
	
		
			
				|  |  | +            </dl>
 | 
	
		
			
				|  |  | +            <dl>
 | 
	
		
			
				|  |  | +                <dt>选择支付方式</dt>
 | 
	
		
			
				|  |  | +                <dd class="no-padding" id="paytype">
 | 
	
		
			
				|  |  | +                    <div class="paytype-option active" data-type="wechat">
 | 
	
		
			
				|  |  | +                        <span><i class="icon-wechat"></i>微信支付</span>
 | 
	
		
			
				|  |  | +                        <span class="icon-checkbox"></span>
 | 
	
		
			
				|  |  | +                    </div>
 | 
	
		
			
				|  |  | +                    <div class="paytype-option" data-type="alipay" style="display:none;">
 | 
	
		
			
				|  |  | +                        <span><i class="icon-alipay"></i>支付宝支付</span>
 | 
	
		
			
				|  |  | +                        <span class="icon-checkbox"></span>
 | 
	
		
			
				|  |  | +                    </div>
 | 
	
		
			
				|  |  | +                </dd>
 | 
	
		
			
				|  |  | +            </dl>
 | 
	
		
			
				|  |  | +        </div>
 | 
	
		
			
				|  |  | +    </div>
 | 
	
		
			
				|  |  | +    <div id="pay"></div>
 | 
	
		
			
				|  |  | +    <button class="button fixed-button" id="submit">确认支付</button>
 | 
	
		
			
				|  |  | +    <div class="tiplayer" style="display: none;">
 | 
	
		
			
				|  |  | +        <div class="pay-result">
 | 
	
		
			
				|  |  | +            <h3>订单信息</h3>
 | 
	
		
			
				|  |  | +            <p>VIP会员1年: <em>¥300</em></p>
 | 
	
		
			
				|  |  | +            <div class="btns">
 | 
	
		
			
				|  |  | +                <a href="#" id="unpay">未支付</a>
 | 
	
		
			
				|  |  | +                <a href="#" id="ypay">我已支付</a>
 | 
	
		
			
				|  |  | +            </div>
 | 
	
		
			
				|  |  | +        </div>
 | 
	
		
			
				|  |  | +    </div>
 | 
	
		
			
				|  |  | +<script type="text/javascript" src="js/global.js?v=099b487e"></script><script type="text/javascript" src="js/pay.js?v=099b487e"></script></body>
 | 
	
		
			
				|  |  | +<script>
 | 
	
		
			
				|  |  | +function pay(self, url,mobile,type)
 | 
	
		
			
				|  |  | +{
 | 
	
		
			
				|  |  | +    var html = self.html();
 | 
	
		
			
				|  |  | +    //self.unbind('click');
 | 
	
		
			
				|  |  | +    self.html('支付中...');
 | 
	
		
			
				|  |  | +    $.getJSON(url + '&json=1', {mobile:mobile,type:type}, function(t) {
 | 
	
		
			
				|  |  | +        self.html(html);
 | 
	
		
			
				|  |  | +        if (t.status == 1) {
 | 
	
		
			
				|  |  | +            //$('.tiplayer').show();
 | 
	
		
			
				|  |  | +            $("#pay").html(t.data);
 | 
	
		
			
				|  |  | +        } else {
 | 
	
		
			
				|  |  | +            submit();
 | 
	
		
			
				|  |  | +            //$('.tiplayer').hide();
 | 
	
		
			
				|  |  | +            alert(t.msg);
 | 
	
		
			
				|  |  | +        }
 | 
	
		
			
				|  |  | +    })
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +    $(function(){
 | 
	
		
			
				|  |  | +        var oPackage = {
 | 
	
		
			
				|  |  | +            price: 100,
 | 
	
		
			
				|  |  | +            package: 1,
 | 
	
		
			
				|  |  | +            url:''
 | 
	
		
			
				|  |  | +        },oPayType = "wechat";
 | 
	
		
			
				|  |  | +        $('#package').on('click','[data-package]',function(){
 | 
	
		
			
				|  |  | +            $(this).addClass('active').siblings().removeClass('active');
 | 
	
		
			
				|  |  | +            oPackage.price = $(this).data('price');
 | 
	
		
			
				|  |  | +            oPackage.name = $(this).data('name');
 | 
	
		
			
				|  |  | +            oPackage.package = $(this).data('package');
 | 
	
		
			
				|  |  | +            oPackage.url = $(this).data('url');
 | 
	
		
			
				|  |  | +            $('#submit').html('确认支付¥' + oPackage.price);
 | 
	
		
			
				|  |  | +        })
 | 
	
		
			
				|  |  | +        $('#paytype').on('click','[data-type]',function(){
 | 
	
		
			
				|  |  | +            $(this).addClass('active').siblings().removeClass('active');
 | 
	
		
			
				|  |  | +            oPayType = $(this).data('type')
 | 
	
		
			
				|  |  | +        })
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +        function submit()
 | 
	
		
			
				|  |  | +        {
 | 
	
		
			
				|  |  | +            var open = $('#open').val();
 | 
	
		
			
				|  |  | +            if (open == 2) {
 | 
	
		
			
				|  |  | +                $('.tiplayer').show();
 | 
	
		
			
				|  |  | +                //实时检测是否支付成功
 | 
	
		
			
				|  |  | +                /*
 | 
	
		
			
				|  |  | +                setInterval(function()
 | 
	
		
			
				|  |  | +                {
 | 
	
		
			
				|  |  | +                    var url = $('#open').attr('data-url');
 | 
	
		
			
				|  |  | +                    var order_id = $('#open').attr('data-order_id');
 | 
	
		
			
				|  |  | +                    var buy_id = $('#open').attr('data-buy_id');
 | 
	
		
			
				|  |  | +                    $.getJSON(url + '&json=1', {order_id:order_id,buy_id:buy_id}, function(t) {
 | 
	
		
			
				|  |  | +                        if (t.data == 1) {
 | 
	
		
			
				|  |  | +                            location.href = $('#ypay').attr('href');
 | 
	
		
			
				|  |  | +                        }
 | 
	
		
			
				|  |  | +                    })
 | 
	
		
			
				|  |  | +                }, 1000);
 | 
	
		
			
				|  |  | +                */
 | 
	
		
			
				|  |  | +            }
 | 
	
		
			
				|  |  | +            $('#submit').unbind('click').bind('click', function(){
 | 
	
		
			
				|  |  | +                var mobile = $("#mobile").val();
 | 
	
		
			
				|  |  | +                if(!/1\d{10}/.test(mobile)){
 | 
	
		
			
				|  |  | +                    alert("手机号码不正确");
 | 
	
		
			
				|  |  | +                    return;
 | 
	
		
			
				|  |  | +                }
 | 
	
		
			
				|  |  | +                //console.log(mobile,oPackage,oPayType)
 | 
	
		
			
				|  |  | +                $('.pay-result p').html('VIP会员'+oPackage.name+': <em>¥'+oPackage.price+'</em>');
 | 
	
		
			
				|  |  | +                pay($(this), oPackage.url, mobile, oPayType);
 | 
	
		
			
				|  |  | +            })
 | 
	
		
			
				|  |  | +        }
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +        submit();
 | 
	
		
			
				|  |  | +        
 | 
	
		
			
				|  |  | +        
 | 
	
		
			
				|  |  | +        $('.active').click();
 | 
	
		
			
				|  |  | +    })
 | 
	
		
			
				|  |  | +</script>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +</html>
 |