Javascript 仅在父级而不是子级上删除事件 $（“.alert”）。单击（函数（）{ $（this）.fadeOut（300，function（）{ $（this.remove（）； }); }); 标题 文本。。。

因此，上面的代码工作得很好，除了我需要使它，以便用户可以选择文本区域内的文本。此时，当他们单击textarea（其包含在.alert中）时，会立即将其与div一起删除

我无法从div中删除textarea，因为我需要它包含在div中，并且在单击div的其他部分时被删除

---

因此，我如何从其包含div的click事件中明确排除textarea，同时仍然允许包含div的click事件删除textarea。

您可以通过防止

click

事件从

textarea

传播（冒泡）到

div

来做到这一点：

<script>
$(".alert").click(function(){
    $(this).fadeOut(300, function(){            
        $(this).remove();            
    });
});
</script>

<div class="alert alert-error">                
    <h4>title</h4>
    <textarea class="pull-right">text...</textarea>
</div>   

例如：

$（“.alert”）。单击（函数（）{
$（this）.fadeOut（300，function（）{
$（this.remove（）；
});
});
$（“.alert textarea”）。在（“单击”上，函数（e）{
e、 停止传播（）；
});

标题
文本。。。
您可以通过防止
单击事件从
文本区域
传播（冒泡）到
div
来做到这一点：

<script>
$(".alert").click(function(){
    $(this).fadeOut(300, function(){            
        $(this).remove();            
    });
});
</script>

<div class="alert alert-error">                
    <h4>title</h4>
    <textarea class="pull-right">text...</textarea>
</div>   

例如：


$（“.alert”）。单击（函数（）{
$（this）.fadeOut（300，function（）{
$（this.remove（）；
});
});
$（“.alert textarea”）。在（“单击”上，函数（e）{
e、 停止传播（）；
});

标题
文本。。。
您也可以使用not选择器执行此操作：

$(".alert textarea").on("click", function(e) {
    e.stopPropgation();
});


$（“.alert*：not（textarea）”。单击（function（）{
$（this）.fadeOut（300，function（）{
$（this.parent（）.remove（）；
});
});
标题
文本。。。

查看此小提琴：
您也可以使用not选择器执行此操作：

$(".alert textarea").on("click", function(e) {
    e.stopPropgation();
});


$（“.alert*：not（textarea）”。单击（function（）{
$（this）.fadeOut（300，function（）{
$（this.parent（）.remove（）；
});
});
标题
文本。。。

看看这把小提琴：
这确实很方便。我没有意识到有一个not选择器。@Bruce&Gatsbill:如果单击
.alert
元素本身而不是它的一个子元素（警报不会关闭）：如果
文本区域
位于
.alert
的子元素内部而不是直接包含在
.alert
中，它也不会工作（当您单击
文本区域时，警报将关闭）：这确实非常方便。我不知道有一个not选择器。@Bruce&Gatsbill:单击
。警报
元素本身而不是它的子元素时，这将不起作用（警报不会关闭）：如果
textarea
位于
.alert
的子代中，而不是直接包含在
.alert
中，则该警报也将不起作用（单击
textarea
时警报将关闭）：