注册 登录 充值会员 退出
网站、APP、小程序等定制开发,联系QQ 1206995177 毕业设计 java源码 PHP源码
充值

jquery+html5手机滑动删除和添加列表项代码

作者/代码整理:  (源码已亲测,不会安装的可以向QQ1915635791要安装视频教程) 发布日期:2022-05-08
jquery+html5手机滑动删除和添加列表项代码
这是一款基于jquery+html5实现的手机触屏滑动删除列表和点击添加列表项代码。


js代码

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/framework7.min.js"></script>
<!-- Path to your app js-->
<script type="text/javascript" src="js/upscroller.js"></script>
<script type="text/javascript" src="js/my-app.js"></script>
<script>
    $(".addbtn").click(function(){

        $("ul").append(
                '<li class="swipeout" >'+
                '<div class="item-content">'+
                '<div class="item-inner">'+
                '<div class="item-title label">' +
                '<textarea name="" id="" placeholder="请输入内容" >'+
                '</textarea>'+
                '</div>'+
                '<div class="item-input">'+
                '<img class="imgsc img1"  src="img/i-f7-ios.png" width="87" height="87" alt=""/>'+
                '<img src="img/add.png" class="imgsc img2"  width="87" height="87" alt=""/>'+
                '</div>'+
                '</div>'+
                '<div class="swipeout-actions-right">'+
                '<a href="#" class="swipeout-delete">Delete</a>'+
                '</div>'+
                '</div>'+
                '</li>'

        );

        $('.item-input').each(function(i){
            console.log($(this).find('img:first').attr('id','zoom'+i));
            console.log($(this).find('img:first').next().attr('id','add'+i));
        })

    });

</script>