Question

我有2个链接可以隐藏主页上用户的不同信息。如果单击一个链接，则新信息将显示在屏幕上。问题是，当我点击任何链接时，窗口将被带回页面顶部。我想防止这种行为，因为它很烦人。

以下是链接的代码

<div align="right" id="ajaxIncomingMail"><a href="#" class="incomingMail">Incoming Mail</a></div><div id="ajaxOutgoingMail"><h5><a href="#" class="outgoingMail">Outgoing Mail</a></h5></div>

这里是jquery的代码：

        $(function(){
      $("a.incomingMail").click(function(e){
            e.preventDefault();
            $("#ajaxMailShowContentOutbox").hide();
            $("#ajaxMailShowContentInbox").fadeIn("slow");
        });

        $("a.outgoingMail").click(function(e){
            e.preventDefault();
            $("#ajaxMailShowContentInbox").hide();
            $("#ajaxMailShowContentOutbox").fadeIn("slow");
        });
        return false;
    });

我在这里使用的是preventDefault（），它仍然无法正常工作！？我也尝试过返回false，但这也不起作用。我不知道它是否重要，但所提供的信息是从数据库中提取的。点击链接后如何才能使滚动停止？

Answer 1

return false;不应该在实际的jQuery点击事件中，而不是在它之外吗？

修改

$(function(){ $("a.incomingMail").click(function(e){ e.preventDefault(); $("#ajaxMailShowContentOutbox").hide(); $("#ajaxMailShowContentInbox").fadeIn("slow"); return false; }); $("a.outgoingMail").click(function(e){ e.preventDefault(); $("#ajaxMailShowContentInbox").hide(); $("#ajaxMailShowContentOutbox").fadeIn("slow"); return false; }); });

Answer 2

你可能在a标签中有href ='＃'，将其改为href ='###'，它应该停止滚动。

Answer 3

您可能想尝试：

$("a.incomingMail").live("click", function(e) {
    e.preventDefault();
    $("#ajaxMailShowContentOutbox").hide();
    $("#ajaxMailShowContentInbox").fadeIn("slow");
});

和

$("a.outgoingMail").live("click", function(e) {
    e.preventDefault();
    $("#ajaxMailShowContentInbox").hide();
    $("#ajaxMailShowContentOutbox").fadeIn("slow");
});

如果从数据库中提取信息，则

而不是.click，因为将click事件处理程序绑定到带有.click（）的链接将仅将事件处理程序应用于已加载到页面上的元素和不是以后加载的元素来自数据库。

Jquery：单击链接后阻止窗口滚动

3 个答案: