javascript - 页面中键点击监听器

Question

当我使用中键单击时，我需要弹出警报，并且如果我在链接上单击它，但在页面的任何其他元素上(或只是在空白区域上)单击它，则它一定不会弹出。

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

当我在链接上使用中键单击时会出现警报，但我需要防止链接出现这种行为

我需要类似“!gContextMenu.onLink”的东西，但不适用于上下文菜单(没有)

Answer 1

您可以通过多种方法来测试点击的目标是否为链接。一种方法是检查 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因为这就是 click events 的规范中的内容和 MouseEvent.which是非标准的。请注意，这还需要测试 e.button === 1 而不是 2。