jquery - 单击相关链接时显示一个 div 并隐藏其他

标签 jquery html hyperlink click show

我有这段代码:

<head>
<script>

        $(document).ready(function(){
        // Optional code to hide all divs
        $("div").hide();
          // Show chosen div, and hide all others
        $("a").click(function () 
        {
            $("#" + $(this).attr("class")).show().siblings('div').hide();
        });

    });

</script>

</head>

<body>
    Click a button to make it visible:<br /><br />
<a href="" class="one">One</a>
<a href="" class="two">Two</a>
<a href="" class="three">Three</a>
<a href="" class="four">Four</a><br /><br />

    <div id="one">One</div>
    <div id="two">Two</div>
    <div id="three">Three</div>
    <div id="four">Four</div><br/><br/>




</body>

我想在点击相关链接时显示一个 div。问题是这个过程只持续几秒钟。有人知道为什么吗?谢谢

最佳答案

使用preventDefault()

        $("a").click(function (e) 
    {
            e.preventDefault();
        $("#" + $(this).attr("class")).show().siblings('div').hide();
    });

演示 Fiddle

关于jquery - 单击相关链接时显示一个 div 并隐藏其他,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18843244/

相关文章:

jquery - 当 CSS 网格保留它们时,如何在 Jquery 中过滤带有 <a> 链接的元素?

javascript - 使用 javascript 追加添加 href

html - Twitter Bootstrap 不允许高度 :100% on small screens, 尝试了其他问题中描述的所有解决方案

html - 两个 Div 没有并排对齐

c++ - Mangle dll 使用 DEF 文件导出名称

Android ACTION_SEND 超链接在 GMail 中不起作用

javascript - 第一次调用函数不会按预期工作,但下次可以工作

javascript - 从 jQuery 1.9.1 迁移到 1.10.1 导致错误 : Object has no method

javascript - 带有带有两个参数的 onclick 函数的 HTML 输入字符串 - 不起作用

ios - 使用 UIActivityViewController 在电子邮件中发送链接