javascript - クリックによる内部要素の操作を停止します

Question

画面をカバーするdivがあります。div内には別のdivがあり、その中に画像が動的に配置されます。ユーザーが外側のdivをクリックすると、それが閉じます。これで問題ありません。ユーザーが画像または画像をクリックすると、画像も閉じますが、どうすればそれを防ぐことができますか？彼らが外側のdivをクリックした場合にのみ閉じたい。

これが私が使用しているものです。これを機能させるには何をする必要がありますか？

$("#black-out").click(function(){
    $(this).fadeOut("slow");
});

HTML：

<div id="black-out"><div id="image-holder"></div></div>

Answer 1

クリックされた要素が、イベントがバインドされた要素と同じであるかどうかを確認します。

$("#black-out").click(function(e){
    if (e.target == this) $(this).fadeOut("slow");
});