Question

单击按钮时，会触发执行以下操作的功能：

function doThings() {
   1. display an overlay
   2. display table on top of overlay
   3. assign event for table click
   4. assign event for everything else BUT table click
}

4.的想法是处理table内部除之外的点击，或者更具体地说，来自table-div内部的点击。这是我试过的：

function doThings() {
   // 1. display an overlay
   // 2. display table on top of overlay
   // 3. assign event for table click (interaction happens here)

   // 4.
   $("body").not( ".table-div" ).click(function(e) {
       // hide my overlay and stop interaction
   });
}

问题是，当添加4.时，单击我的按钮时，部分3.中编码的交互不会开始。我也试过这个：

   // 4.
   $("body").click(function(e) {
      if ( ! (e.target.class == "table-div" || $(e.target).parents(".table-div").size()) ) { 
         // hide my overlay and stop interaction
      }
   });

它们都不起作用。我假设body点击事件和table-div点击事件之间存在冲突，但我不确定如何解决它。有没有办法让这项工作？谢谢！

Answer 1

为此，我猜你需要通过以下方式停止事件传播：

 event.stopPropagation();

在＃3你需要使用它。

＃3。因为事件往往会冒泡，你还没有处理它。 似乎可能。因此，您只需要处理事件传播。这会阻止事件冒出来。

那应该是这样的：

   $( ".table-div" ).click(function(e) {
        e.stopPropagation(); // <---here

如何知道点击事件是否来自div之外？

1 个答案: