jQuery PreventDefault() 停止 onclick 工作

Question

我在 jQuery PreventDefault 运行标签的 onclick 函数时遇到问题。这是我的例子:Avoid page jump on # click

$("#main a").bind("click", function (e) { 
    e.preventDefault();
}); 

我认为 PreventDefault 会停止默认事件 (href="#")。但它会让“onclick”事件仍然触发。如果我将该函数放入我的函数中，它就会起作用。但我想在链接上有不同的 onclick 函数。

Answer 1

正如 adeneo 和 Jeremy 所提到的，不要使用内联事件处理程序。它们会干扰您的 jQuery 事件处理程序。

只需将 2 个函数合并为一个，它就可以工作:

$("#main a").bind("click", function (e) { 
    e.preventDefault();

    var p = $(this).position();
    $("#loader").css("top", p.top - 20);
    $("#loader").toggle();
});

JSFiddle

<小时/>

If I put the function inside my function it works. But I want to have different onclick functions on the links.

如果您想在不同的链接上使用不同的 onclick 函数，请使用类(或 ID)并使用 jQuery 适本地选择它们。

HTML:

<div id="main">
    <p><a class="doSomething" href="#">I will NOT JUMP!</a></p>
    <p><a class="doSomethingElse" href="#">I will NOT JUMP</a></p>
</div>

jQuery:

$("#main a.doSomething").bind("click", function (e) { 
    e.preventDefault();

    var p = $(this).position();
    $("#loader").css("top", p.top - 20);
    $("#loader").toggle();
});

$("#main a.doSomethingElse").bind("click", function (e) { 
    e.preventDefault();

    //Other code
});

JSFiddle demo