<a>标签无跳转

以下内容不是新技术,是个人的一些整理,确实有借鉴其他闪文的地方,请原文作者谅解。

  前不久做网站时,用到导航栏这种东西,随便从脚本之家上搜了一种效果了事。具体情况是,导航栏父级菜单没有链接功能,鼠标移上去显示子菜单列表即可。于是我的脚本是这样修改的,如下:

<a href="javascript://">父级菜单</a>

  结果是这种写法在一些浏览器下不能到达预期效果(无跳转),我没有花时间把这种写法在主流浏览器上都测试一遍看效果。因为这种写法根本就不规范,在搜索引擎中也没有搜不到该写法,索性理解成一个菜鸟在头脑发热时的一种发明创造。

  也许当时我想表达的是,javascript:void(0),确实这种写法是存在也常见的。一些有关她的知识如下:

  1、含义为死链接

  2、完整写法为 javascript:void(expression)

  void是一个操作符,该操作符指定要计算一个表达式但不返回值;expression是一个要计算的表达式。当用户点击链接时,void(0)不返回值,所以等同于javascript:;

  细心观察,打开微博和QQ空间时,上面的脚本会经常出现在浏览器底部。

  最后是一些搜集的资料

  1、<a>的onclick事件被先执行,其次是href属性下的动作;

  2、将href属性设置为#后,点击链接后将跳动到页面顶部。因为锚点默认为Top,如果不想让页面跳动,可以将一个#改成多个#;

  3、如果在链接的href属性中调用一个有返回值的函数,当前页面的内容将被此函数的返回值代替;

  4、尽量不要用javascript:做为<a>标记的href属性,这样不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放

最后,我将原来的写法修改为

<a href="#" onclick="javascript:return false;">父级菜单</a>
原文地址:https://www.cnblogs.com/ccweb/p/2150999.html