javascript等效於'mouseleave'的觸摸互動

Question

預先警告：我對js很陌生，主要通過搜索網絡搜索示例/教程來獲得。

我寫的js應該可以在網絡和移動設備上運行（例如iPad）。

我們有一個庫，幫助抽象掉mouse和touch之間的差異：

if (navigator.userAgent.search('Mobile') > 0) { 
    window.FLAGS = { 
    start: 'touchstart', 
    end: 'touchend', 
    move: 'touchmove', 
    click: 'click', 
    touchScreen: true 
    }; 
} else { 
    window.FLAGS = { 
    start: 'mousedown', 
    end: 'mouseup', 
    move: 'mousemove', 
    click: 'click', 
    touchScreen: false 
    }; 
} 

然後在代碼中，你可以做這樣的事情：

widget.view.bind(FLAGS.start, function(e) { 

我試圖找到相當於一個touch爲mouseleave，所以我可以做一個類似的伎倆。

我能想象的方式通過跟蹤move位置和比較，爲邊界問題widget的盒子搭上leave事件，但我希望有一個小的一行像touchstart/mousedown關係。

Answer 1

它已經提出，但據我所知沒有實現：http://www.quirksmode.org/mobile/advisoryTouch.html

像這樣的東西可能會奏效（從我的頭頂，未經測試寫它）：

var element; 
document.addEventListener('touchstart', function(event) { 
    event.preventDefault(); 
    var touch = event.touches[0]; 
    element = document.elementFromPoint(touch.pageX,touch.pageY); 
}, false); 

document.addEventListener('touchmove', function(event) { 
    event.preventDefault(); 
    var touch = event.touches[0]; 
    if (element !== document.elementFromPoint(touch.pageX,touch.pageY)) { 
     touchleave(); 
    } 
}, false); 

function touchleave() { 
    console.log ("You're not touching the element anymore"); 
} 

Answer 2

可能想查看jquery touchable插件。