javascript - 当元素相互包含时如何在元素上获取 jquery onClick 事件

Question

我有一个包含表格的div

<div id="container">
<table id="data">
<tbody>
......
......
</table>
</div>

我在表格行上绑定(bind)了 onclick 事件，这样如果用户单击一行，它就会突出显示

$("#data tr").mouseup(function() {

        $("tr.selected").removeClass("selected");// Deselect currently selected rows
        $(this).addClass("selected");       
        });

现在，如果用户单击表格外的某处，我想取消选择该行。问题是，如果我将点击事件与 div 绑定(bind)，则表和 div 都会获得回调...我如何才能只获得 div 的回调？这样我就可以取消选择行了!!我什至尝试将 onClick 与 body 元素绑定(bind)，但如果你将一个事件与一个元素绑定(bind)，它会很幸运，它里面的所有元素都会得到回调。如果是这样的话，如果用户在表格边界外单击，我该如何取消选择这些行。

Answer 1

这是嵌套元素冒泡造成的。您可以使用

停止它

$("div").click(function(e) {


            if($(this).attr('id')=="data")
            {
                e.stopPropagation();
                return;
            }


                $(".selected").removeClass("selected");

        });

        $("#data tr").mouseup(function() {


        $("tr.selected").removeClass("selected");// Deselect currently selected rows
        $(this).addClass("selected");       

        }); 

发件人:http://api.jquery.com/event.stopPropagation