给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实现禁止后退的方法
Dec 27 Javascript
深入认识JavaScript中的函数
Jan 22 Javascript
比较简单的异步加载JS文件的代码
Jul 18 Javascript
jquery实现简单易懂的图片展示小例子
Nov 21 Javascript
JavaScript使用循环和分割来替换和删除元素实例
Oct 13 Javascript
js实现的简洁网页滑动tab菜单效果代码
Aug 24 Javascript
基于构造函数的五种继承方法小结
Jul 27 Javascript
小程序图片长按识别功能的实现方法
Aug 30 Javascript
node中IO以及定时器优先级详解
May 10 Javascript
Vue.js计算机属性computed和methods方法详解
Oct 12 Javascript
vscode中Vue别名路径提示的实现
Jul 31 Javascript
基于VUE实现简单的学生信息管理系统
Jan 13 Vue.js
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
便携利器 — TECSUN PL-365简评
2021/03/02 无线电
提问的智慧
2006/10/09 PHP
php中的比较运算符详解
2013/10/28 PHP
ThinkPHP3.1新特性之字段合法性检测详解
2014/06/19 PHP
老生常谈PHP位运算的用途
2017/03/12 PHP
PHP实现的简单对称加密与解密方法实例小结
2017/08/28 PHP
PHP中引用类型和值类型功能与用法示例
2019/02/26 PHP
PHP中echo与print区别点整理
2021/03/09 PHP
DOM下的节点属性和操作小结
2009/05/14 Javascript
javascript css styleFloat和cssFloat
2010/03/15 Javascript
js带按钮的提示框可供选择示例代码
2013/09/17 Javascript
jQuery实现统计复选框选中数量
2014/11/24 Javascript
javascript面向对象之共享成员属性与方法及prototype关键字用法
2015/01/13 Javascript
深入浅析Extjs中store分组功能的使用方法
2016/04/20 Javascript
SelecT下拉框选中和取值的解决方法
2016/11/22 Javascript
JS实现的表头列头固定页面功能示例
2017/01/10 Javascript
Javascript设计模式之装饰者模式详解篇
2017/01/17 Javascript
bootstrap组件之导航组件使用方法
2017/01/19 Javascript
jQuery使用EasyUi实现三级联动下拉框效果
2017/03/08 Javascript
学习使用Bootstrap页面排版样式
2017/05/11 Javascript
详解如何在angular2中获取节点
2017/11/23 Javascript
以v-model与promise两种方式实现vue弹窗组件
2018/05/21 Javascript
JSX在render函数中的应用详解
2019/09/04 Javascript
Python json模块使用实例
2015/04/11 Python
Python数据分析之获取双色球历史信息的方法示例
2018/02/03 Python
用Eclipse写python程序
2018/02/10 Python
详解Python 协程的详细用法使用和例子
2018/06/15 Python
关于Tensorflow分布式并行策略
2020/02/03 Python
pyecharts绘制中国2020肺炎疫情地图的实例代码
2020/02/12 Python
在Mac中PyCharm配置python Anaconda环境过程图解
2020/03/11 Python
python字符串的index和find的区别详解
2020/06/20 Python
css3动画过渡实现鼠标跟随导航效果
2018/02/08 HTML / CSS
纯CSS实现颜色渐变效果(包含环形渐变、线性渐变、彩虹效果等)
2014/05/07 HTML / CSS
CSS3实现文字波浪线效果示例代码
2016/11/20 HTML / CSS
电子信息工程自荐信
2014/05/26 职场文书
2015年三万活动总结
2015/03/25 职场文书