jQuery，点击其可点击的容器内的元素 - 如何覆盖

我有一个列表元素li，成为我的图像轮播。每个元素都是一个缩略图，使用jQuery可以点击，因为我需要将图像作为libackground-image。这我不能改变。当大拇指点击时，它会调用一个lightbox来显示作为bg参数传递的图像。jQuery，点击其可点击的容器内的元素 - 如何覆盖

<ul id="piclist"> 
    <li class="box" style="background-image: url('url_1');"><i class="seq" id="1"></i></li> 
    <li class="box" style="background-image: url('url_2');"></li> 
    <li class="box" style="background-image: url('url_3');"><i class="seq" id="2"></i></li> 
    <li class="box" style="background-image: url('url_4');"></li> 
</lu>

的一块我jQuery代码要做到这一点：

<script type="text/javascript"> 
    $('.box').click(function() { 
     return $(this).ekkoLightbox(); 
    }); 
</script>

IT WORKS！但在某些特殊情况下，缩略图必须显示一种按钮，所以我使用了定位<i></i>，因为该项目中使用了Font Awesome。

图像波纹管可以说明什么即时通讯谈论：

enter image description here

的问题是：

当li负载的i元素，它也必须是可点击的，它的链接必须覆盖他的父母链接 - 容器。

我在jQuery中做了一段代码来做到这一点，但总是当我点击i元素按钮时，操作会从li加载图片灯箱。这是不对的。它应该执行另一个操作，例如，在新窗口中打开一个URL，加载另一个模式，whatelse。

<script type="text/javascript"> 
    $('.box').click(function() { 
     return $(this).ekkoLightbox(); 
    }); 
    $('.seq').click(function() { 
     console.log($(this).attr("id")); //IT WORKS! 
      *do other action...* //Doesn´t work, open the <li> lightbox! 
    }); 
</script>

任何帮助？ :)

来源

2014-01-22 Massa

更改$（ 'SEQ'）点击此：

$('.seq').click(function(ev) { 
    ev.stopPropagation(); 

    console.log($(this).attr("id")); //IT WORKS! 
    *do other action...* //Doesn´t work, open the <li> lightbox! 
});

这将防止click事件冒泡触发点击甚至是我的父母（李）。注意我添加了事件对象作为参数，我在做任何其他事情之前调用stopPropagation（http://api.jquery.com/event.stoppropagation/）方法。

来源

2014-01-22 20:11:41 JoseMarmolejos

嗨，何塞，它的工作！非常好，最简单的不可能！ hehehe – Massa

太棒了，很高兴它有帮助。你介意接受答案作为这个问题的正确答案吗？ – JoseMarmolejos

在正确的时间恰到好处的代码 - 谢谢！ – wloescher

检查e.target是相同的：

<script type="text/javascript"> 
    $('.box').click(function(e) { 
     if(e.target !== this) return; 
     return $(this).ekkoLightbox(); 
    }); 
    $('.seq').click(function() { 
     console.log($(this).attr("id")); //IT WORKS! 
     *do other action...* 
    }); 
</script>

来源

2014-01-22 20:09:22

jQuery，点击其可点击的容器内的元素 - 如何覆盖

回答

相关问题