单击时调用函数，除非在某些元素上发生单击

Question

当用户点击模态时，我希望隐藏模态。我通过使用此代码完成此操作：

$(".modal").click(function(event){
  $('#myModal').modal('hide');
});    

但是，.modal包含img和p，当用户点击这些元素时，我不希望隐藏模态。实现这一目标的最佳方法是什么？

感谢。

Answer 1

使用$(event.target).is('.modal')检查点击的元素是否为模态。

$(".modal").on('click', function (event) {
    if ($(event.target).is('.modal')) {
        $('#myModal').modal('hide');
    }
});

Example Here