Ontouchstart事件不會在removeChild後觸發

我發現嘗試爲iPad編寫JavaScript的問題。我還沒有在其他HTML5觸摸瀏覽器上測試過，所以我不知道這是iPad/Mobile Safari bug還是更普遍的東西。Ontouchstart事件不會在removeChild後觸發

問題是，如果一個對象有一個ontouchstart事件監聽器連接，它最初工作正常，但在我從它的父容器中刪除它並再次添加它後，它停止工作。

這裏有一個最小的工作示例：

<!DOCTYPE html> 
<html lang="en" dir="ltr"> 
<head> 
<meta charset="utf-8" /> 
<title>Test</title> 
<script type="text/javascript"> 
    window.onload = function(e) { 
     document.getElementById("btn").onclick = clickBtn; 
     document.getElementById("touch").ontouchstart = touchDiv; 
    } 

    function clickBtn(e) { 
     var cnt = document.getElementById("container"); 
     var tdv = document.getElementById("touch"); 
     cnt.removeChild(tdv); 
     cnt.appendChild(tdv); 
    } 

    function touchDiv(e) { 
     var sp = document.getElementById("sp");   
     sp.innerHTML += "*"; 
    } 
</script> 
</head> 
<body> 
<div id=container> 
<div style="width: 200px; height: 200px; background-color: red;" id="touch">Touch this</div> 
</div> 
<button id="btn">Test</button> 
<span id=sp></span> 
</body> 
</html>

（爲方便起見，我把它也在這裏：http://dl.dropbox.com/u/8100013/test.html）如果您觸摸iPad上的紅色正方形，一個「*」添加到旁邊的文字顯示觸發事件觸發的按鈕。按下按鈕可從其父容器中移除紅色方塊並再次添加。之後，至少在我的iPad上，不再添加「*」字符，所以看起來touchstart不會觸發。

有誰知道發生了什麼事？我承認我是Javascript/HTML5的新手，所以我可能會漏掉一些明顯的東西，但在使用鼠標的PC上，在相同的情況下，mousedown事件在移除和重新插入對象後正常工作。

來源

2012-06-03 Jsl

刪除dom元素的父項也會刪除附加的事件，其中包括全部。但我認爲如果不是.removeChild，那麼document.body.appendChild就不會發生。

來源

2012-06-03 21:24:06 Sebas

我現在測試了這個。如果我替換「cnt.removeChild（tdv）;」用「document.body.appendChild（tdv）;」它仍然在iPad上工作。 – Jsl

Ontouchstart事件不會在removeChild後觸發

回答

相關問題