iscroll 点击一次弹出N次

发布于 2022-09-03 13:33:35 字数 3106 浏览 26 评论 0

使用iscroll，
头一次点击左边的li 再点击右边的 li ，弹出1次，
第二次点击左边的li 再点击右边的 li , 弹出2次。
手机上测试，
第二次点击左边的li 再点击右边的 li , 弹出2次。
依此累堆。

请大神解答

<!DOCTYPE html>
<html lang="cn">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        /*默认内容区域*/

        .nctouch-main-layout {
            display: block;
            margin-top: 2rem;
            background-color: #F5F5F5;
        }

        .nctouch-main-layout-a {
            display: block;
            position: absolute;
            top: 4rem;
            right: 0;
            left: 0;
            bottom: 0;
            overflow: hidden;
            z-index: 1;
        }

        .categroy-cnt {
            width: 3.8rem;
            height: 100%x;
            display: block;
            float: left;
            position: absolute;
            z-index: 1;
            top: 2rem;
            bottom: 0;
            left: 0;
            overflow: hidden;
        }

        .categroy-cnt li {
            width: 100%;
            height: 20px;
            margin-top: 5px;
            background-color: #333;
            color: #fff;
        }

        .categroy-rgt {
            background-color: #FCFCFC;
            position: absolute;
            z-index: 1;
            left: 3.8rem;
            top: 2rem;
            bottom: 0;
            right: 0;
            overflow: hidden;
        }

        .categroy-rgt li {
            width: 100%;
            height: 20px;
            margin-top: 5px;
            background-color: #888;
            color: #fff;
        }
    </style>
</head>

<body>
    <div class="nctouch-main-layout">
        <div class="categroy-cnt" id="categroy-cnt">

        </div>
        <div class="categroy-rgt" id="categroy-rgt">

        </div>
    </div>
</body>
<script src="http://localhost/shopnc/m/js/zepto.min.js" charset="utf-8"></script>
<script src="http://b2b2c.shopnctest.com/dema/wap/js/iscroll.js" charset="utf-8"></script>
<script type="text/javascript">
    var html = '';
    html += '<ul>';
    for (var i = 0; i <= 10; i++) {
        html += '    <li>' + [i] + '</li>';
    }
    html += '</ul>';
    $('#categroy-cnt').html(html);
    new IScroll("#categroy-cnt", {
        mouseWheel: true,
        click: true
    })


    $("#categroy-cnt").on("click", "li", function() {
        html = '';
        html += '<ul>';
        for (var i = 0; i <= 10; i++) {
            html += '    <li>' + [i] + '</li>';
        }
        html += '</ul>';
        $('#categroy-rgt').html(html);
        new IScroll("#categroy-rgt", {
            mouseWheel: true,
            click: true
        })
    });

    $("#categroy-rgt").on("click", "li", function() {
        alert(556)
    });
</script>

</html>

分享到QQ

分享到微博