页面中间单击侦听器

Page Middle Click Listener

本文关键字：侦听器 单击 中间      更新时间：2023-09-26

我需要弹出警报，当我使用中间点击，它必须不弹出，如果我点击链接，但在页面的任何其他元素(或只是在空白空间)。

var test = {
pageMiddleClickListener : function(e) {
    if(e.which === 2) {     
        //if (!gContextMenu.onLink) {
            alert('ok');
        //}
    }
}
window.addEventListener("click",test.pageMiddleClickListener,false);

当我在链接上使用中键时，会显示警告，但我需要防止链接

出现这种行为

我需要一些像"!gContextMenu。

有多种方法可以测试点击的target是否为链接。一种方法是检查Element.tagName是否为A，另一种方法是测试href的性质。事实证明，测试目标的parentNode是否有链接也是必要的。

var test = {
    pageMiddleClickListener : function(e) {
        if(e.button === 1) {     
            if (!test.isLinkOrAParentIsLink(e.target)) {
                e.view.alert('ok');
            }
        }
    },
    isLinkOrAParentIsLink : function(el) {
        if (el.tagName === "A") {
            return true;
        } //else
        let parent= el.parentNode;
        while (parent !== null && typeof parent.tagName !== "undefined") {
            if (parent.tagName === "A") {
                return true;
            } //else
            parent= parent.parentNode;
        }
        return false;
    }
}
window.addEventListener("click",test.pageMiddleClickListener,false);

或

    isLinkOrAParentIsLink : function(el) {
        if (el.hasAttribute("href")) {
            return true;
        } //else
        let parent= el.parentNode;
        while (parent !== null && typeof parent.tagName !== "undefined") {
            if (parent.hasAttribute("href")) {
                return true;
            } //else
            parent= parent.parentNode;
        }
        return false;
    }

注意:我将e.which更改为e.button，因为这是点击事件的规范，MouseEvent.which是非标准的。注意，这也需要测试e.button === 1而不是2。

您可以使用prop方法检查是否单击了<a>。

$(this).prop("tagName") == "A"

在您的事件侦听器中:

var test = {
   pageMiddleClickListener : function(e) {
       if(e.which === 2) {     
        // not an <a> ?
        if ($(this).prop("tagName") !== "A") {
            alert('ok');
        }
   }
}
window.addEventListener("click",test.pageMiddleClickListener,false);
相关文章：