search

Home  >  Q&A  >  body text

javascript - 如何解决这个关于touchmove与touchstart事件问题?

touchend让li背景变成灰色,touchend去掉灰色;如果是touchmove不改变li背景颜色!
我写的代码touchmove也会使li背景变成灰色!如何解决?
我的代码:

$(function() {
    attachEvent($("#scroller li"),function (){
        $(this).addClass("select");
    }, function () {
        $(this).removeClass("select");
    });
});

//我自己封装的方法
function attachEvent(src,cb1,cb2){

    $(src).unbind();//解绑事件
    //检查是否是触屏设备
    var isTouchDevice="ontouchstart"in window||navigator.msMaxTouchPoints;
    if(isTouchDevice){//如果是则.....
            //绑定触碰按下事件
        $(src).bind("touchstart",function(){
            $(this).data("touchon",true);//设置data-touchon="true"
            cb1.bind(this)();//调用回调函数cb1,增加select样式(背景变灰色)
            //cb2.bind($(this).siblings())();//调用回调函数cb2,this的兄弟元素删除select样式(背景变灰色)
        });
        //绑定触碰离开事件
        $(src).bind("touchend",function(){
            if($(this).data("touchon")){//如果data-touchon="true"
                cb2.bind(this)();//调用回调函数cb2,删除select样式(背景变灰色)
            }
            $(this).data("touchon",false);
        });
        //绑定触碰移动事件
        $(src).bind("touchmove",function(){
            $(this).data("touchon",false);
             $(this).removeClass("select");//修改
        });

    }else{//如果不是触碰设备绑定鼠标事件
        $(src).bind("mousedown",function(){
            cb1.bind(this)();
        });
        $(src).bind("mouseup",function(){
            cb2.bind(this)();
        })
    }
}

已经修改,并解决

大家讲道理大家讲道理2902 days ago199

reply all(2)I'll reply

  • PHP中文网

    PHP中文网2017-04-10 17:00:39

    直接CSS不就好了 :active

    reply
    0
  • 阿神

    阿神2017-04-10 17:00:39

    你的touchstart事件执行函数已经让li添加了select类,在touchmove的时候当然不会改变li的样式啦!

    reply
    0
  • Cancelreply