微信端长按删除

2017-05-10  本文已影响0人  hey_前端豆

先要引用zepto.js 使用zepto自带的touchstart 和 touchend函数来监听触摸事件。
本方法采用zepto+js

    //长按删除
    $.fn.longPress = function(fn) {
        var timeout = undefined;
        var $this = this;
        console.log(this);
        for(var i = 0;i<$this.length;i++){
            $this[i].addEventListener('touchstart', function(event) {
              console.log(event);
                var target = event.target;
                console.log(target);
                var hdId = target.getAttribute('hdId');
                timeout = setTimeout(function(e){
                    layer.confirm('您确定要删除吗?', {
                        btn: ['确认','取消'] //按钮
                    }, function(){
                        console.log(hdId);
                        var info = {
                          hdId:hdId,
                        }
                        $.ajax({
                          url:"http://test.xxdoctor.cn/wechat/HealthFile/delHisDiacrisisInfo",
                          type:"POST",
                          data:JSON.stringify(info),
                          contentType: "application/json; charset=utf-8",
                          success:function(data){
                              layer.msg('已删除', {icon: 1});
                              moduleValue();
                          },
                          error:function(err){
                              console.log(err);
                          }
                      })
                    });
                }, 800);  //长按时间超过800ms,则执行传入的方法
                event.preventDefault();
            }, false);
            $this[i].addEventListener('touchend', function(event) {
                clearTimeout(timeout);  //长按时间少于800ms,不会执行传入的方法
            }, false);
        }
    }

    $('.family-illness').longPress(function(e){

    });

family-illness为父元素,它的子元素是动态生成的。因此用target获取目标元素

上一篇下一篇

猜你喜欢

热点阅读