javascript - 父元素的click事件不起作用

查看:134
本文介绍了javascript - 父元素的click事件不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问 题

我用的cloud-zoom插件。内部结构如下

<li title="红色">
                                <a href="images/bag-img_03.png" class='cloud-zoom-gallery'  title='Red' rel="useZoom: 'zoom1', smallImage: 'images/bag-img_03.png' ">
                                    <img src="images/bag-img_03.png" alt="" mid="images/bag-img_03.png" big="images/bag-img_03.png" />
                                </a>
</li>
a标签插件里面有个点击事件

if($(this).is('.cloud-zoom-gallery')) {

            opts = $.extend({}, c, d);
            $(this).data('relOpts', opts);
            $(this).bind('click', $(this), function(a) {
                var b = a.data.data('relOpts');
                $('#' + b.useZoom).data('zoom').destroy();
                $('#' + b.useZoom).attr('href', a.data.attr('href'));
                $('#' + b.useZoom + ' img').attr('src', a.data.data('relOpts').smallImage);
                $('#' + a.data.data('relOpts').useZoom).CloudZoom();
                return false
            })
            
            然后我写的li的事件就失效了。 上面也没阻止这个冒泡事件啊。我把return false去掉就可以了。但是A标签会造成页面的跳转。我又把href改成了别的属性、这样会不会某些地方出错。
            或者有没有别的方法可以让li的事件触发。 

解决方案

阻止a标签的默认事件、可以用event.preventdefault()

http://www.w3school.com.cn/js...

一篇文章是上图这样写的

return false不要随便用就是了、想要阻止什么就写什么、不要让坏习惯让自己以后踩自己埋的雷

具体可以查看
http://www.jb51.net/article/4...

这篇关于javascript - 父元素的click事件不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆