使用Javascript防止点击链接

时间:2012-07-20 00:31:46

标签: javascript html tags navigation anchor

$('a').click(function(e){return false;});

它几乎可以在所有地方成功禁用链接,但不能在本网站主题标签上的工具提示弹出窗口中找到的链接上工作(SO)。我查看了DOM,它们确实是<a>个标签。

为什么?

是否有更强大的方法强制我的用户留在当前页面上? (这是一个书签,我以图形方式操作DOM,所以我需要能够点击并拖动所有内容,包括链接。)

我知道即使我可以禁用所有锚点上的常规点击功能,它也不会对其他标记上的其他点击回调触发的任何导航执行任何操作。

3 个答案:

答案 0 :(得分:3)

尝试使用.on - 例如SO网站将在您的活动附后创建这些链接

$(document).on('click', 'a', function(e) {
 return false;
});

答案 1 :(得分:1)

我之前使用的一种技术是在整个文档上放置一个看不见的绝对定位元素。这实际上是由Firebug Lite使用,以允许Element Inspector拦截任何点击。

然后,您需要担心的是将事件监听器附加到绝对定位的元素,并确定单击时鼠标下的元素。幸运的是,所有现代浏览器都实现了一种辨别方法:document.elementFromPoint。实现之间存在一些差异;这是我经常使用的方法(不幸的是,功能检测对此有点棘手,因此我正在进行浏览器检测):

var scrollIsRelative = !($.browser.opera || $.browser.safari && $.browser.version < "532");
$.fromPoint = function(x, y) {

     if(!document.elementFromPoint) return null;

     if(scrollIsRelative)
     {
         x -= $(document).scrollLeft();
         y -= $(document).scrollTop();
     }

     return document.elementFromPoint(x, y);

};

将单击事件监听器附加到绝对定位的div并单击,隐藏div并调用此方法获取元素,然后再次显示div。例如:

$('#hugeDiv').on('click', function(ev) {
    var x = ev.pageX;
    var y = ev.pageY;
    $(this).hide();
    var el = $.fromPoint(x, y);
    $(this).show();

    //do stuff with el
});

答案 2 :(得分:0)

似乎解决方案是

window.onbeforeunload = function() {
  return "Are you sure you want to navigate away?";
}

如果我自己这么说的话,正确使用事件系统。

问题的原始范围不够广泛。这解决了导致我的问题的问题。