Question

我发现尝试为iPad编写JavaScript代码时出现问题。我没有在其他HTML5触摸浏览器上测试过这个，所以我不知道这是iPad / Mobile Safari的错误还是更普遍的。

问题是，如果一个对象附加了一个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上，“*”字符不再被添加，因此似乎触摸开始不会触发。

有谁知道发生了什么事？我承认我是Javascript / HTML5的新手，所以我可能会遗漏一些明显的东西，但是在带有鼠标的PC上的情况相同，mousedown事件在删除和重新插入对象后工作正常。

Answer 1

删除dom元素的父元素也会删除附加的事件，所有。但我认为，如果不是.removeChild，而是document.body.appendChild，那就不会发生。

removeChild后不会触发Ontouchstart事件

1 个答案: