在我看来触摸事件不会冒泡,即使是everyone seems to say or imply that they do .我已经在 Chrome 29.0.1547.62(使用“模拟触摸事件”覆盖)和 android webview(使用 cordova)上进行了测试,touchstart 事件都没有发生事件冒泡。这是一个例子:
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<style>
#a {
background-color: red;
position: absolute;
top: 0px;
height: 100px;
width: 100%;
}
#b {
background-color: blue;
position: absolute;
top: 0px;
height: 50px;
width: 100%;
}
</style>
<script>
$(function() {
$('#a').on('touchstart', function(){
console.log("a start")
})
$('#b').on('touchstart', function(){
console.log("b start")
})
})
</script>
</head>
<body>
<div id="a"></div>
<div id="b"></div>
</body>
</html>
即使 b 在 a 之上,当 b 被触摸时也只有 b 的 touchstart 事件被触发。怎么回事?
最佳答案
您不了解事件冒泡。
这并不意味着 even 会触及所有周围的元素。这意味着事件从嵌套最深的元素开始,一直向上通过其祖先到达 document
,并调用它在途中找到的处理程序。
在您的 HTML 中,您有 sibling 。
<div id="a"></div>
<div id="b"></div>
要使用冒泡,它们需要嵌套。
<div id="a">
<div id="b"></div>
</div>
关于javascript - 如何在 javascript 中使触摸事件(在 dom 上)冒泡?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18677107/