0

我在尝试为 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 上触摸红色方块，则会在旁边的文本中添加一个“*”按钮以显示触发了 touchstart 事件。按下按钮会从其父容器中删除红色方块并再次添加它。在那之后，至少在我的 iPad 上，不再添加“*”字符，所以似乎 touchstart 没有触发。

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

4

1 回答 1

0

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

于 2012-06-03T21:24:06.230 回答