Question

我使用Java Script Show / Hide DIV Toggler我找到here。它有效，但副作用是每次点击切换都会将我带到页面顶部。在FF和Chrome中检查，两种浏览器都有同样的优惠。我无法确定它是否重新启动了该页面，但我知道它没有重新加载它。

这是脚本：

<script type="text/javascript">
<!--
    function toggle_visibility(id) {
       var e = document.getElementById(id);
       if(e.style.display == 'block')
          e.style.display = 'none';
       else
          e.style.display = 'block';
    }
//-->
</script>

这是切换（请注意href =＆＃34;＃＆＃34; - 问题是什么？）：

<a href="#" onclick="toggle_visibility('gallery_info');">[Click to see more details]</a>

这是显示/隐藏的div（因为你可以看到它开始隐藏）：

<div id="gallery_info" style="display: none;">

有什么想法吗？

非常感谢！亚历

Answer 1

与该功能无关，它是跳转到页面顶部的a标记，您可以在其中使用event.preventDefault()或return false用于阻止a代码默认操作的功能。

Answer 2

使用javascript：as href而不是＃

<a href="javascript:" onclick="toggle_visibility('gallery_info');">[Click to see more details]</a>

Answer 3

将e.preventDefault()添加到该函数以停止单击链接的默认行为。指定href='#'表示指向当前页面顶部的链接，这就是您当前看到该行为的原因。如果你正在使用jquery，你也可以从函数中return false。

请注意，上面的变量e是作为onclick函数的第一个参数传递的事件对象

JS Show / Hide DIV Toggler捕捉到页面顶部

3 个答案: