3

我尝试使用 stopPropagation() 没有运气。
我有这个结构:

<div class="logos">  
</div>

我有一个绑定到徽标的单击,它在其中附加了 img 元素,结果如下:

<div class="logos">
  <img width="100" height="80" src="/js/fileupload/uploads/Penguins.jpg">  
  <img width="100" height="80" src="/js/fileupload/uploads/Hydrangeas.jpg">
</div>

我想将单击事件绑定到这些图像,因此当它们被单击时,它们可以从“徽标”div 中删除,我使用 .live() 来跟踪这些单击。
结果是,当我单击图像时,“logos”单击事件和 img 单击事件都会被触发。

    $('.logos img').live('click', function(e){
        var answer = confirm ("Delete image?")
        if (answer){
            $(this).remove();
        }
    });
    $('.logos').click(function(e){
            e.stopPropagation();
            $('.qq-upload-button input').trigger('click'); //File uploader that uploads images and creates the img elements.
    });  

谢谢

4

2 回答 2

4

从 jQuery 1.7 开始,.on() 方法提供了附加事件处理程序所需的所有功能。

那来自DOCS,但e.stopPropagation()在点击传播到父级之前,也可以将您的图像放在您的图像上!:)

jsBin 演示

$('.logos img').on('click', function(e){
        e.stopPropagation();
        var answer = confirm("Delete image?");
        if (answer){
            $(this).remove();
        }
});

$('.logos').click(function(){
     $('.qq-upload-button input').click();
});
于 2012-09-25T01:10:01.647 回答
4

你可以做这样的事情。如果您使用 > jQuery 1.4,您应该使用on而不是live. 检查目标,如果它是图像,则将其删除。否则就这样吧。

http://jsfiddle.net/AprTx/

$('.logos').on('click', function(e) {
    e.stopPropagation();

    if ($(e.target).is('img')) {
        $(e.target).remove();
    }
    else {
        $(this).append($('<img src="http://placehold.it/300x300" />'));
    }
});​
于 2012-09-25T01:10:35.533 回答