dever-product
/
wonderful


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142
							<!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>