给html超链接设置事件不使用href来完成跳


Posted in Javascript onApril 20, 2014

有的时候,我们需要使用<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>
Javascript 相关文章推荐
javascript模块化是什么及其优缺点介绍
Sep 02 Javascript
jQuery插件MixItUp实现动画过滤和排序
Apr 12 Javascript
元素绑定click点击事件方法
Jun 08 Javascript
基于jQuery实现的QQ表情插件
Aug 25 Javascript
jQuery添加和删除指定标签的方法
Dec 16 Javascript
Bootstrap实现下拉菜单效果
Apr 29 Javascript
基于JavaScript实现带缩略图的轮播效果
Jan 12 Javascript
webpack配置proxyTable时pathRewrite无效的解决方法
Dec 13 Javascript
解决Vue 给mapState中定义的属性赋值报错的问题
Jun 22 Javascript
vue中后端做Excel导出功能返回数据流前端的处理操作
Sep 08 Javascript
通过实例解析js可枚举属性与不可枚举属性
Dec 02 Javascript
【js设计模式】SOLID五大设计原则
Mar 24 Javascript
jQuery响应enter键的实现思路
Apr 18 #Javascript
jquery easyui 结合jsp简单展现table数据示例
Apr 18 #Javascript
jQuery如何取id有.的值一般的方法是取不到的
Apr 18 #Javascript
用jquery仿做发微博功能示例
Apr 18 #Javascript
实例说明为什么不要行内使用javascript
Apr 18 #Javascript
自制的文件上传JS控件可支持IE、chrome、firefox etc
Apr 18 #Javascript
禁用Tab键JS代码兼容Firefox和IE
Apr 18 #Javascript
You might like
PHP+javascript制作带提示的验证码源码分享
2014/05/28 PHP
使用array_map简单搞定PHP删除文件、删除目录
2014/10/29 PHP
php中get_magic_quotes_gpc()函数说明
2017/02/06 PHP
微信封装的调用微信签名包的类库
2017/06/08 PHP
php学习笔记之mb_strstr的基本使用
2018/02/03 PHP
jQuery 1.3 和 Validation 验证插件1.5.1
2009/07/09 Javascript
有效的捕获JavaScript焦点的方法小结
2009/10/08 Javascript
页面回到顶部的三种实现(锚标记,js)
2012/10/01 Javascript
JSON语法五大要素图文介绍
2012/12/04 Javascript
jquery ui对话框实例代码
2013/05/10 Javascript
jquery中的工具使用方法$.isFunction, $.isArray(), $.isWindow()
2015/08/09 Javascript
js实现文本框宽度自适应文本宽度的方法
2015/08/13 Javascript
JS获取月份最后天数、最大天数与某日周数的方法
2015/12/08 Javascript
Javascript数组中push方法用法分析
2016/10/31 Javascript
微信小程序  http请求封装详解及实例代码
2017/02/15 Javascript
详解vue父子组件间传值(props)
2017/06/29 Javascript
详解如何使用babel进行es6文件的编译
2018/05/29 Javascript
微信小程序显示倒计时功能示例【测试可用】
2018/12/03 Javascript
微信小程序开发实现的IP地址查询功能示例
2019/03/28 Javascript
python中的内置函数getattr()介绍及示例
2014/07/20 Python
python中sets模块的用法实例
2014/09/30 Python
Python中尝试多线程编程的一个简明例子
2015/04/07 Python
Python连接DB2数据库
2016/08/27 Python
python3实现抓取网页资源的 N 种方法
2017/05/02 Python
python装饰器常见使用方法分析
2019/06/26 Python
500行代码使用python写个微信小游戏飞机大战游戏
2019/10/16 Python
CSS改变网页中鼠标选中文字背景颜色例子
2014/04/23 HTML / CSS
纯CSS3实现圆角效果(含IE兼容解决方法)
2014/05/07 HTML / CSS
Css3新特性应用之视觉效果实例
2016/12/12 HTML / CSS
日本快乐生活方式购物网站:Shop Japan
2018/07/17 全球购物
计算机专业优秀大学生自我总结
2014/01/21 职场文书
期末自我鉴定
2014/02/02 职场文书
向国旗敬礼学生寄语大全
2014/09/30 职场文书
2015年女工委工作总结
2015/07/27 职场文书
教你快速开启Apache SkyWalking的自监控
2021/04/25 Servers
Python实现信息管理系统
2022/06/05 Python