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()を使用してそれらのクリックを追跡しました。
その結果、画像をクリックすると、「ロゴ」クリック イベントと 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.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 に答える
4

jQuery 1.7 以降、.on() メソッドは、イベント ハンドラーをアタッチするために必要なすべての機能を提供します。

それはDOCSe.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 に答える