停止传播不起作用

Question

我有下面的JQuery eventhandler.我想停止网页上的所有导航.

$(document).click(function(event) {
            event.stopPropagation();
            event.preventDefault();
            event.cancelBubble = true;
            event.stopImmediatePropagation();
            $(document).css('border-color','');
            $(document).css('background-color',''); 
            $(event.target).css('border-color','yellow');
            $(event.target).css('background-color','#6BFF70');
            return false;
    });

当我在Facebook登录页面上使用它时,它会停止所有导航.但在谷歌主页上,"我感觉很幸运"按钮仍然导航到下一页.我该如何避免呢？

我顺便使用JavaFX浏览器.它类似于Safari浏览器.

Answer 1

如果我加载Google搜索页面,请在控制台执行此操作:

document.body.addEventListener(
  "click", 
  function (ev) { ev.stopPropagation(); ev.preventDefault(); },
  true);

然后我再也不能点击"我很幸运"按钮.关键是使用第三个参数并将其设置为true.以下是MDN [说]的内容:

useCapture 可选的

如果为true,则useCapture表示用户希望启动捕获.在启动捕获之后,指定类型的所有事件将被分派到已注册的侦听器,然后再分派到EventTargetDOM树中的任何下方.

(重点补充.)

您尝试执行的操作无效,因为您的事件处理程序已启用document,因此将在文档子项上的任何事件处理程序之后调用.所以你的处理程序无法阻止任何事情

随着useCapture设置为true,就可以得到它要传递给子元素的机会之前,对事件进行操作.我不知道如何让jQuery的事件处理程序以你的方式工作useCapture.Barmar 在这里的回答说你不能使用jQuery来设置这样的处理程序.我倾向于相信他.

Answer 2

由于我评论的原因,99.99%的网页无法通过停止事件传播来停止导航(在触发事件的初始目标的所有处理程序之前,您无法停止事件).如果您想要阻止导航,我建议您使用window.onbeforeunload事件,该事件是针对这种情况而定的.

这是一个例子:http://jsfiddle.net/ejreseuu/

HTML:

<a href="google.com">google</a>

JS:

window.onbeforeunload = function() {
    return "Are you sure?"
}

没有办法没有我知道的确认框,因为无论他们做什么通常都是恶意的,导致用户无法导航的代码.