vue.js中实现在弹框外有鼠标点击事件时隐藏弹框

功能描述:点击按钮popBtn实现弹框pop的显示和隐藏交替;在弹框pop外有鼠标点击事件时需要隐藏弹框pop,但是要除开按钮popBtn。

mounted() {
    // 监听页面的点击事件,如果鼠标在pop弹出框和popBtn按钮外点击,那么让弹出框不显示
    document.onclick = () => {
      let e = e || window.event;
      let elem = e.srcElement || e.target;
      // console.log(elem)
      while (elem) {
        if (elem.id == "pop" || elem.id == "popBtn") {
          return;
        }
        elem = elem.parentNode;
      }
      this.isPop = false;
    };
  },

 

你可能感兴趣的:(web前端,弹框,vue.js,javascript)