logo标签列表

禁用链接的默认行为

javascriptjqueryjquery-plugins
7

我有一个菜单列表：

<ul>
    <li><a href="#about" id="about">ՄԵՐ ՄԱՍԻՆ</a></li>
    <li><a href="#products" id="products" >ԱՐՏԱԴՐԱՆՔ</a></li>
    <li><a href="#farm" id="farm" >ՏՆՏԵՍՈՒԹՅՈՒՆ</a></li>
    <li><a href="#gallery" id="gallery" >ՆԿԱՐՆԵՐ</a></li>
    <li><a href="#contacts" id="contacts">ՀԵՏԱԴԱՐՁ ԿԱՊ</a></li>
</ul>

我使用address插件来实现ajax的后退/前进，但是我遇到了一个小问题，无法解决。
当我点击菜单时，如果页面有滚动条，它会将页面移动到菜单出现在页面顶部的位置，但我不需要这样做。
有没有一种方法可以禁用这种行为？
非常感谢。
可能是重复的问题：如何禁用“href”属性的默认<a>行为？ - givanse
4个回答
11

创建或修改链接的 click() 事件处理程序，使用 preventDefault() 方法。

例如：

$("a").click 
(
    function (evt)
    {
        //YOUR CODE HERE

        evt.preventDefault(); 
        return false;  
    } 
);
8

尝试将以下内容添加到您的链接中：

onclick="return false;"

由于您可能会为此链接添加一个点击事件的事件处理程序。只需在其末尾添加返回false，而不是直接在HTML标记上添加。

1
它不起作用，因为：（addres插件启动也无法正常工作。） - Simon
好的，我看了一下插件示例页面，发现他们没有绑定点击事件，而是使用了change和externalChange事件。你也是这样做的吗？http://www.asual.com/jquery/address/samples/tabs/#已更改以删除代码，因为它看起来很糟糕。 - spinon
1
'

href="#about"

' 是指具有 id 为 'about' 的元素。这就是页面移动的原因。
<!DOCTYPE html>
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>
</head>
<body>

    <div id="datosResultado">
        1<br />
        2<br />
        3<br />
        4<br />
        5<br />
        6<br />
        7<br />
        8<br />
        9<br />
        10<br />
    </div>
    <ul id="yourMenu">
        <li><a href="#about" id="about">about</a></li>
        <li><a href="#products" id="products">products</a></li>
        <li><a href="#farm" id="farm">farm</a></li>
        <li><a href="#gallery" id="gallery">gallery</a></li>
        <li><a href="#contacts" id="contacts">contacts</a></li>
    </ul>

    <div id="you-click"></div>

</body>

<script type="text/javascript">

$(function(){

    $("#yourMenu>li>a").bind("click", function(ev){

        ev.stopPropagation();

        //...your code...

        $("#you-click").html($(this).html());

        return false;
    });
});

</script>
谢谢您的想法。我只需要设置其他“ID”，然后是“href”值。 <a href="#about" id="_about">，就这样;)... - Simon
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接