聚合物:检测自定义元素之外的点击 [英] Polymer: Detect click outside of custom element

问题描述

我有一个自定义元素，并希望检测其外部的点击.例如

I have a custom element and would like to detect clicks outside of it. For example

<dom-module id="simple-element">



<style>
  </style>

  <template>
    <content></content>
  </template>

</dom-module>

<script>
  (function() {
    Polymer({
      is: 'simple-element',
      listeners: {
        'tap': 'regularTap'
      },
      regularTap: function() {
        console.log("i was tapped");
      }
    });
  })();
</script>

是否有一个我可以听的事件，该事件可以告诉我用户在元素外部单击的时间?谢谢.

Is there an event where I can listen to which will tell me when user has clicked outside of the element? Thanks.

推荐答案

按照这些方式进行操作应该可以满足您的要求:

Something along these lines should do what you want:

window.addEventListener('click', (e) => {
  var target = event.target;

  while(target != this && target != document.body) {
    target = Polymer.dom(target).node.domHost.parentNode;
    // might need some additional steps to get the parent from inside custom elements
    // don't know by heart
  }
  if(target == this) {
    // inside element
  } else {
    // outside element
  }
});

这篇关于聚合物:检测自定义元素之外的点击的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！