移动端JS父层Touch事件用了冒泡，子层onclick事件不生效

Posted 2023-04-18

如题，我的html结构大概是这样的
<div id="mydiv">
<img onclick="func(this)">
<img onclick="func(this)">
<img onclick="func(this)">
</div>
我给mydiv父层做了addEventListener的touch冒泡，使下面的图片进行滑动切换。

但是现在给子层img添加点击事件缺不生效，进入不到onclick的方法里面，请问要如何解决？比较急

移动端JS父层Touch事件用了冒泡，子层onclick事件不生效，这时候子元素就要用委托来绑定事件啊，不能直接在子元素上onclick,如$("#mydiv").on("touchend", "img", func(this))。
可以参照这篇文章（我找的别人的）http://blog.csdn.net/cysear/article/details/72302977 参考技术A 楼主解决没有 参考技术B 说的不是很明白，最后多贴点代码或者打上断点，自己debug

移动端click失效

移动端使用touch事件，但是会影响到a标签的使用，click事件在touch后执行

先判断节点是否是a标签，之后阻止touch事件冒泡。

document.addEventListener(‘touchend‘,function (e) {
    if (e.target.tagName == ‘A‘ || e.target.tagName === ‘button‘){
        e.stopPropagation();
    }else{
        if(!$("#qt").hasClass("hide")){
            $("#qt").addClass("hide");
        }
    }
    $(".transport_type ul li a").click(function(){
        $("#qt").toggleClass("hide");
    });
});