jQuery - 将e.preventDefault（）添加到所有链接点击事件？

I'm making a script in jQuery, and I have many click links click events. The thing is that I don't want the links I have click events for to do anything except the event, so I put an e.preventDefault(); at start of all my click events. But I have many click events, so is there a more simple way to just add the e.preventDefault(); to all the links click events? Remember I also have some links that I want to work as they should, so adding the e.preventDefault(); to all the links won't work, I only want to add it to links with click event.

我在jQuery中制作一个脚本,我有很多点击链接点击事件。问题是我不希望我点击事件的链接除了事件之外做任何事情,所以我放了一个e.preventDefault();在我的所有点击事件开始时。但是我有很多点击事件,所以有一个更简单的方法来添加e.preventDefault();到所有链接点击事件?请记住,我也有一些我想要工作的链接,所以添加e.preventDefault();所有链接都无法正常工作,我只想将其添加到点击事件的链接中。

4 个解决方案

#1

You could try overriding the bind method, or the click method, before any of your binding code runs. Here I'm overriding the click method in a fairly hacky way. I would really recommend just calling preventDefault where you need it.

在任何绑定代码运行之前,您可以尝试覆盖bind方法或click方法。在这里,我以相当hacky的方式覆盖了click方法。我真的建议只在你需要的地方调用preventDefault。

(function(){
    var original = jQuery.fn.click;
    jQuery.fn.click = function(){
        // wrap your function in another function
        var f = arguments[0];
        arguments[0] = function(e) {
            e.preventDefault();
            f(e);
        }
        original.apply( this, arguments );
    }
})();

Example in action: http://jsfiddle.net/k4jzb/

行动示例:http://jsfiddle.net/k4jzb/

#2

you can use jquery namespaced events

您可以使用jquery命名空间事件

http://docs.jquery.com/Namespaced_Events

HTH

you can do something like this for the links you want to add a click event but prevent the default behaviour

您可以为要添加单击事件的链接执行类似的操作,但可以防止出现默认行为

$('a.someClass').bind('click.dontClick',function(e){

e.preventDefault();

});

and for the links you want the normal click behaviour

对于您想要正常点击行为的链接

$('a.clickClass').bind('click.doClick',function(e){

//your event handling code here

});

DEMO

#3

This SO answer details how to detect events on an element, but it looks like the asker took that answer and built a jQuery plugin for selecting elements based on their event listeners.

这个SO答案详细说明了如何检测元素上的事件,但看起来提问者接受了这个答案并构建了一个jQuery插件,用于根据事件监听器选择元素。

So you could use that plugin and then use some event delegation like so:

所以你可以使用该插件然后使用一些事件委托,如下所示:

$(document).delegate('a:Event(click)', 'click', function (e) { e.preventDefault(); });

Warning: I've never used this plugin myself, and I'm not really familiar with custom jQuery CSS filters, so this might not actually work. At all.

警告:我自己从未使用过这个插件,而且我对自定义jQuery CSS过滤器并不熟悉,所以这可能实际上并不起作用。完全没有。

#4

I would take @3nigma's answer a little further. Usually the links you don't want to do default actions on are like <a href="#">

我会更进一步了解@ 3nigma的答案。通常,您不希望执行默认操作的链接类似于

So filter out these links so the page doesn't jump when clicked. I use jQuerys filter() function. Not sure if that is the best. What do you think?

因此,过滤掉这些链接,以便在单击时页面不会跳转。我使用jQuerys filter()函数。不确定这是否是最好的。你怎么看?

$('a').filter(function(i) {
return $(this).attr("href") === "#";
})
.bind('click.dontClick',function(e){
e.preventDefault();
})

Example here: Filter a tags containing #

示例:过滤包含#的标签

#1

(function(){
    var original = jQuery.fn.click;
    jQuery.fn.click = function(){
        // wrap your function in another function
        var f = arguments[0];
        arguments[0] = function(e) {
            e.preventDefault();
            f(e);
        }
        original.apply( this, arguments );
    }
})();