Question

此代码部分执行左或右滑动的简单测试，然后生成一个警告，说明已检测到的内容。它在Chrome中工作正常但在IE11中失败。我怀疑错误在于swipedir函数的addEventListener元素，但我无法弄清楚IE反对或忽略的内容。我们将非常感激地提供任何帮助。提前谢谢。

<!DOCTYPE html>  
    <html>  
    <head>  
    <style>  
    #touchsurface{  
    width: 1240px;  
    height: 1400px;  
    padding: 10px;  
    font-size: 24px;  
    line-height: 1.1em;  
    background: lightyellow;  
    border: 1px solid orange;  
    }  
    #touchsurface2{  
    width: 1280px;  
    height: 1400px;  
    border: 1px solid orange;    
    background: lightyellow top center no-repeat;  
    }  
    #touchsurface2 #inner{  
    width: 100%;  
    height: 100%;  
    }  
    </style>  
    <script>  
    function swipedetect(el, callback){  

        var touchsurface = el,  
        swipedir,  
        startX,  
        startY,  
        distX,  
        distY,  
        threshold = 150,   
        restraint = 100, 
        allowedTime = 300, 
        elapsedTime,  
        startTime,  
        handleswipe = callback || function(swipedir){}  

        touchsurface.addEventListener("touchstart", function(e){
            var touchobj = e.changedTouches[0];  
            swipedir = "none";  
            dist = 0;  
            startX = touchobj.pageX;  
            startY = touchobj.pageY;  
            startTime = new Date().getTime() ;  
            e.preventDefault();  
        }, false);  
        touchsurface.addEventListener("touchmove", function(e){  
            e.preventDefault() ;  
        }, false);  
        touchsurface.addEventListener("touchend", function(e){  
            var touchobj = e.changedTouches[0];  
            distX = touchobj.pageX - startX ;  
            distY = touchobj.pageY - startY ;  
            elapsedTime = new Date().getTime() - startTime ;  
            if (elapsedTime <= allowedTime){   
                if (Math.abs(distX) >= threshold && Math.abs(distY) <= restraint){   
                    swipedir = (distX < 0)? "left" : "right" ;  
                }        
            }  
            if (distX > 0) {swipedir = "right";} 
            if (distX < -1) {swipedir = "left";} 
            handleswipe(swipedir);
            e.preventDefault();
        }, false);
    }
    </script>
    </head>
    <body>
    <script>
    window.addEventListener("load", function(){
        var el = document.getElementById("touchsurface2");
        var inner = document.getElementById("inner");
        var hidetimer = null;   
        swipedetect(el, function(swipedir){ 
            if (swipedir != "none"){
            alert(swipedir);
                clearTimeout(hidetimer);

                hidetimer = setTimeout(function(){ 
                    inner.style.background = '';
                }, 1000)
            }   
        });
    }, false);
    </script>
    <div id="touchsurface2">
        <div id="inner">
            Swipe Me
        </div>
    </div>
    </body>
    </html>

代码适用于Chrome，但不适用于IE11

0 个答案: