|
@@ -0,0 +1,158 @@
|
|
|
+<!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=bd05a1cd" rel="stylesheet"><link href="css/multpay.css?v=bd05a1cd" rel="stylesheet"></head>
|
|
|
+
|
|
|
+<body>
|
|
|
+ <div class="maginfo">
|
|
|
+ <img src='https://api.huoxingkandiqiu.com/upload/data/upload/1/2019/04/08/3e4fa30da716886c9183e3f9e1cb3243.jpg' mode='aspectFill' />
|
|
|
+ <div>
|
|
|
+ <span>NINE PERCENT(百分之九)
|
|
|
+ 新偶像的诞生</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="members">
|
|
|
+ <div class='dl'>
|
|
|
+ <div class='dt'>
|
|
|
+ <img class="avatar" src='https://7.jstyle.cn/1/2019/08/05/449ee8aaf309a298c1a5641c41430d0d.jpg' />
|
|
|
+ <div class='info'>
|
|
|
+ <span>明星</span>
|
|
|
+ <div class='dymsg'><span class='ico-dingyue'></span>2000订阅</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class='dd'>
|
|
|
+ <div class='button' data-starid="1" node-act="subscribe">订阅</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class='dl'>
|
|
|
+ <div class='dt'>
|
|
|
+ <img class="avatar" src='https://7.jstyle.cn/1/2019/08/05/449ee8aaf309a298c1a5641c41430d0d.jpg' />
|
|
|
+ <div class='info'>
|
|
|
+ <span>明星</span>
|
|
|
+ <div class='dymsg'><span class='ico-dingyue'></span>2000订阅</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class='dd'>
|
|
|
+ <div class='button' data-starid="2" node-act="subscribe">订阅</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class='dl'>
|
|
|
+ <div class='dt'>
|
|
|
+ <img class="avatar" src='https://7.jstyle.cn/1/2019/08/05/449ee8aaf309a298c1a5641c41430d0d.jpg' />
|
|
|
+ <div class='info'>
|
|
|
+ <span>明星</span>
|
|
|
+ <div class='dymsg'><span class='ico-dingyue'></span>2000订阅</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class='dd'>
|
|
|
+ <div class='button' data-starid="3" node-act="subscribe">订阅</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="mask fn-hide" id="buylayermask"></div>
|
|
|
+ <div class="buy-layer" id="buylayer">
|
|
|
+ <form bindsubmit='doBuy'>
|
|
|
+ <div class="tit ">正在购买</div>
|
|
|
+ <div class='msg' node-act="buytip">查看购买说明</div>
|
|
|
+ <div class="list">
|
|
|
+ <div class="item active" data-id="1">
|
|
|
+ <span class='name'>购买1本</span>
|
|
|
+ <span>¥8.00</span>
|
|
|
+ </div>
|
|
|
+ <div class="item" data-id="2">
|
|
|
+ <span class='name'>购买1本</span>
|
|
|
+ <span>¥8.00</span>
|
|
|
+ </div>
|
|
|
+ <div class="item" data-id="3">
|
|
|
+ <span class='name'>购买1本</span>
|
|
|
+ <span>¥8.00</span>
|
|
|
+ </div>
|
|
|
+ <div class="item" data-id="4">
|
|
|
+ <span class='name'>购买1本</span>
|
|
|
+ <span>¥8.00</span>
|
|
|
+ </div>
|
|
|
+ <div class="item" data-id="5">
|
|
|
+ <span class='name'>购买1本</span>
|
|
|
+ <span>¥8.00</span>
|
|
|
+ </div>
|
|
|
+ <div class="item" data-id="6">
|
|
|
+ <span class='name'>购买1本</span>
|
|
|
+ <span>¥8.00</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="btn-wrapper ">
|
|
|
+ <div class="button cancel" node-act="hideBuy">取消</div>
|
|
|
+ <div class="button primary " node-act="doBuy">确认</div>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ <div class="mask fn-hide" id="buytip">
|
|
|
+ <div class="buytip-layer layer ">
|
|
|
+ <div class='buy-tit'>购买说明</div>
|
|
|
+ <div class="p">
|
|
|
+ 1、购买成功后可直接点击【开始阅读】
|
|
|
+ 查看阅读内容; <br>
|
|
|
+ 2、虚拟商品,如无系统问题,购买后不
|
|
|
+ 可退换; <br>
|
|
|
+ 3、每购买一本,可增加20积分; <br>
|
|
|
+ 4、如有其他使用问题可咨询在线客服。
|
|
|
+ </div>
|
|
|
+ <div class="btn-wrapper">
|
|
|
+ <div class="button" node-act="hideTip">我知道了</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="mask fn-hide" id="layer">
|
|
|
+ <div class="layer read-layer">
|
|
|
+ <div class="qrcode-wrap">
|
|
|
+ <img src="images/qrcode.png" alt="" class="default" id="code">
|
|
|
+ <p>长按识别小程序阅读电子刊</p>
|
|
|
+ </div>
|
|
|
+ <a href="javascript:;" class="btn-close" id="close"></a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+<script type="text/javascript" src="js/global.js?v=bd05a1cd"></script><script type="text/javascript" src="js/multpay.js?v=bd05a1cd"></script></body>
|
|
|
+<script>
|
|
|
+
|
|
|
+ let buyid = 1;
|
|
|
+ let starid;
|
|
|
+
|
|
|
+ $('#close').on('click', function () {
|
|
|
+ $('#layer').hide();
|
|
|
+ });
|
|
|
+
|
|
|
+ $('[node-act="subscribe"]').on('click', function () {
|
|
|
+ $('#buylayer').addClass('slidein')
|
|
|
+ $('#buylayermask').show();
|
|
|
+ starid = $(this).data('starid')
|
|
|
+ })
|
|
|
+ $('#buylayer').on('click','.list .item',function(){
|
|
|
+ $(this).addClass('active').siblings().removeClass('active');
|
|
|
+ buyid = $(this).data('id');
|
|
|
+ })
|
|
|
+
|
|
|
+ $('[node-act="hideBuy"]').on('click',function(){
|
|
|
+ $('#buylayer').removeClass('slidein')
|
|
|
+ $('#buylayermask').hide();
|
|
|
+ })
|
|
|
+
|
|
|
+ $('[node-act="doBuy"]').on('click',function(){
|
|
|
+ console.log(buyid,starid)
|
|
|
+ })
|
|
|
+
|
|
|
+ $('[node-act="buytip"]').on('click', function () {
|
|
|
+ $('#buytip').show()
|
|
|
+ })
|
|
|
+ $('[node-act="hideTip"]').on('click', function () {
|
|
|
+ $('#buytip').hide()
|
|
|
+ })
|
|
|
+</script>
|
|
|
+
|
|
|
+</html>
|