a href=#与 a href=javascript:void(0)的区别？

最新推荐文章于 2024-03-06 09:05:14 发布

原创最新推荐文章于 2024-03-06 09:05:14 发布 · 2.2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #iframe #function #div #浏览器 #脚本

Web 专栏收录该内容

30 篇文章

订阅专栏

本文探讨了解决在iframe内触发div悬浮层时出现的定位错误问题。通过修改<a>标签的href属性，避免了默认滚动到页面顶部的行为。介绍了几种有效的方法，包括使用javascript:void(0)及return false。

前天做的页面是一个iframe弹出窗口（说明一下：同事用js脚本开发出来的）里触发一个<a>链接的按钮可在该窗口上弹出一个div悬浮层。但是每次点击，div悬浮层就自动位于IE窗口的顶端，下面的iframe窗口包含的页面会自动上移，位置错乱了。

同事说主要是<a href='#' onclick='click事件名()'></a>这里的href='#'的原因，把它改成三个#就没问题了，即修改为<a href='###' onclick='click事件名()'></a>

嘿，还真好了。后来网上搜了一下估计是：

＃包含了一个位置信息

默认的锚点是＃top 也就是网页的上端

方法一：所以为了避免这个位置问题有的人提倡采用的方式是javascript:void(0) 来表示一个死链接。

方法二：但是也有的人不提倡采用这种方式，看这篇文章：a href=”javascript:void(0);” — avoid the void大概就明白啥回事了，^_^

    <a href="#" onclick="doSomething();returnfalse;">Link</a>

或者

    <script type="javascript">
    function doSomething() {
      //doSomething
     returnfalse;
   }
   </script>
   <a href="#" onclick="return doSomething();">Link</a>

以往大家不使用"#"的问题是，这将导致点击链接时页面跳回页面顶部，但通过 return false 语句将使得浏览器忽略链接的默认动作，从而避免了此问题。

我想为何同事要用三个#，大概也是让＃包含的位置信息失去效果，但为何用三个而不是二个或四个之类的，就不太清楚了。下次有空再测一下。。。知道答案的朋友就给个评论里吧。先道声：谢谢了