dever-product
/
wonderful


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