js判断是否在页面非焦点区域外点击(前端工具类)

代码:

export default function insideNode(outerNode, innerNode) {
  if(!outerNode || !innerNode){
    return false;
  }else if(outerNode === innerNode){
    return true;
  }else if(outerNode.nodeType == 3){ //节点类型为text类型
    return false;
  }else if(innerNode.nodeType == 3){ //节点类型为text类型
    return containsNode(outerNode, innerNode.parentNode);
  }else if (outerNode.contains) {
    return outerNode.contains(innerNode);
  }else if (outerNode.compareDocumentPosition) {
    return !!(outerNode.compareDocumentPosition(innerNode) & 16);
  }else {
    return false;
  }
}

使用

1.给父区域添加事件(一般为页面document)

document.addEventListener('click', this.onDocumentClick);

2.在onDocumentClick方法类调用insideNode并做相应操作

onDocumentClick: function () {  
  if(!insideNode(outerNode,event.target)){
    //你的操作
  }
},

你可能感兴趣的:(js判断是否在页面非焦点区域外点击(前端工具类))