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