给html超链接设置事件不使用href来完成跳
更新时间：2014年04月20日 13:57:46 作者：
有时候我们需要使用a这个超级链接，而又不使用href来完成跳转，针对这个问题，可以采用下面的解决方案
有的时候，我们需要使用<a>这个超级链接，而又不使用href来完成跳转，而是如：<a href="#" onClick="fun()"></a>这种方式。这样，就不会让页面跳转。但是同时也会带来一些负面的问题，比如页面的title变成了“#”，或者页面出现了滚动条什么的。这是因为在执行完了onClick事件后，<a>又去跳转href所指向的地址了，而”#“是个锚点，默认是网页的页首，所以会带来上边所说的问题。
解决方法有以下两种：
1、onClick事件添加return false语句，例如：
<a href="#" onClick="fun(); return false;">点击</a>
2、用void(0)的方式代替#，例如：
<a href="javascript:void(0)" onclick="fun()">点击</a>
解决方法有以下两种：
1、onClick事件添加return false语句，例如：
复制代码 代码如下:
<a href="#" onClick="fun(); return false;">点击</a>
2、用void(0)的方式代替#，例如：
复制代码 代码如下:
<a href="javascript:void(0)" onclick="fun()">点击</a>
相关文章
相信大家都知道小程序是一种不需要下载安装即可使用的应用,下面这篇文章主要给大家介绍了关于如何开发属于自己的一款小程序的相关资料,文中通过图文介绍的非常详细,需要的朋友可以参考下2023-01-01
这篇文章主要介绍了js实现鼠标感应图片展示的方法,实例分析了javascript鼠标事件及样式的操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-02-02
uni-app使用uniCloud实现图形验证码(uni-captcha)详细过程
这篇文章主要给大家介绍了关于uni-app使用uniCloud实现图形验证码(uni-captcha)的相关资料,实际开发工作中在登陆的时候经常需要图形验证码,需要的朋友可以参考下2023-07-07
这篇文章主要为大家详细解析了JS组件Bootstrap Table使用方法，具有一定的实用性和参考价值，感兴趣的小伙伴们可以参考一下2016-11-11
这篇文章主要介绍了JavaScript常用语句主要包括对循环,判断,字符串换数字相关资料的介绍，具有一定的参考价值，需要的小伙伴可以参考一下具体内容2021-12-12
这篇文章主要介绍了var，let，const异同点,文中较详细的给大家介绍了let和const的相同点和不同点，需要的朋友可以参考下2018-08-08
这篇文章主要介绍了使用typescript封装axios的实例代码，为了方便，在vue3的配置里面按需加载element-plus，本文通过实例代码给大家介绍的非常详细,需要的朋友可以参考下2021-10-10
这篇文章主要介绍了js操作table中tr的顺序实现上移下移一行的效果 ,本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下2018-11-11
在微前端领域当中，沙箱是很重要的一件事情。本文就浅谈前端JS沙箱实现的几种方式，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-07-07
这篇文章主要介绍了webpack中如何加载静态文件的方法步骤，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-05-05
最新评论