Question

我正在尝试将鼠标按下事件绑定到身体及其所有孩子，除了一些项目，使用角度。

我的代码是：

angular.element('body *').not('.searchContainer, .searchContainer *, 
                              #globalSearchInput, #globalSearchTypeMoreOptions,
                              #globalSearchTypeMoreOptions *').bind('mousedown', 
                              function(e){
                                    scope.targetElement = angular.element(e.target);
                              });

但是，它也将事件与不同的事物联系在一起。

我也尝试过使用jQuery，但仍然将事件附加到非选择器。

Answer 1

如果我误读你的帖子，请原谅我，但似乎你愿意使用jquery而不是angular js。

使用jquery，您可以绑定到$('body').mouseup();事件，如果目标元素是＆＃34;例外之一，那么就停止事件传播：

＆＃13;

// create an object to contain your "exception" elements (pink ones)
var notMeElems = $('#globalSearchInput, .searchContainer');


// bind to the bodey mouseup event
$('body').mousedown(function (e) {
  
    // if the target element is part of your exclusion object...
    if ($(e.target).is(notMeElems)) {
      
      // stop the event propogation
        return false;
    }
  
    // or do something else
    $(this).toggleClass('black');
  
});

＆＃13;

div {
    padding: 20px;
    border: dashed 2px steelblue;
    background-color: #ffffff;
}
.searchContainer, #globalSearchInput {
    background-color: pink;
}
.black{
    background-color: #000000;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="globalSearchInput">#globalSearchInput</div>
<div id="div2" class="searchContainer"> Search Container</div>
<div id="div3">3</div>
<div id="div4">4</div>
<div id="div5" class="searchContainer">Search Container</div>

＆＃13;

Answer 2

虽然我们不清楚你想要达到的目标，但我认为这就是你所需要的。

在正文上使用角度ng-mousedown属性，如下所示：

<body ng-mousedown="mousedownFunc()">

然后对要排除的元素使用$event.stopPropagation()函数，如下所示：

<div class="searchContainer" ng-mousedown="$event.stopPropagation()">
   ...
</div>

创建简单的JSFiddle来说明它

将事件绑定到特定元素

2 个答案: