javascript:void(0)是什么意思及href=#与href=javascriptvoid(0)的区别


Posted in Javascript onNovember 13, 2015

Javascript中void是一个操作符,该操作符指定要计算一个表达式但是不返回值。

void 操作符用法格式如下:

1. javascript:void (expression)

2. javascript:void expression

expression 是一个要计算的 Javascript 标准的表达式。表达式外侧的圆括号是选的,但是写上去是一个好习惯。

你以使用 void 操作符指定超级链接。表达式会被计算但是不会当前文档处装入任何内容。

示例-点击超链接不跳转

1:<a href="####"></a>

2:<a href="javascript:void(0)"></a>

3:<a href="javascript:void(null)"></a>

4:<a href="#" onclick="return false"></a>

点击链接后,页面会向上滚到页首,# 默认锚点为 #TOP(实际测试发现 滚动条会滚到顶端)而以上四种方法仅仅表示一个死链接都表示是一个死链接不会跳转也不会返回到顶部.

示例-为什么location.href不自动跳转?

<a href="javascript:void(0)" onclick="delete('123')">删除</a>
function delete(id){
 if(confirm("确实要删除[为什么location.href不自动跳转?]吗?")) {
  location.href="/delete.jsp?id=" + id;
 }
}

以上代码不管如何检查都没有任何问题,而location.href="/delete.jsp?id=" + id;在别的地方都好使,为什么这段代码就行呢?

原因是那个void(0)把代码改成:

<a href="javascript:delete('123')">删除</a>function delete(id) {
 if(confirm("确实要删除[为什么location.href不自动跳转?]吗?")) {
  location.href="/delete.jsp?id=" + id;
 }
}

我们发现,页面立即就跳转了,能正常删除相应的数据.为什么呢?

因为void是一个操作符,会计算一个表达式,但不会返回值,当然也不会改变当前页面的任何内容,也就不会正常的跳转.

说明

void 运算符对表达式求值,并返回 undefined。在希望求表达式的值,但又不希望脚本的剩余部分看见这个结果时,该运算符最有用。

链接(href)直接使用javascript:void(0)在IE中可能会引起一些问题,比如:造成gif动画停止播放等,所以,最安全的办法还是使用“#”。为防止点击链接后跳转到页首,onclick 事件 return false即可。

PS:href=#与href=javascriptvoid(0)的区别

#"包含了一个位置信息 
默认的锚点是#top 也就是网页的上端
而javascript:void(0)  仅仅表示一个死链接 
这就是为什么有的时候页面很长浏览链接明明是#可是跳动到了页首
而javascript:void(0)
则不是如此 所以调用脚本的时候最好用void(0)
或者<input onclick> <div onclick>等 

打开新窗口链接的几种办法

1.window.open('url')

2.用自定义函数       

<script>   
function openWin(tag,obj)   
{    
obj.target="_blank";    
obj.href = "Web/Substation/Substation.aspx?stationno="+tag;    
obj.click();   
}   
</script> 
<a href="javascript:void(0)" onclick="openWin(3,this)">LINK_TEST</a> 
window.location.href=""

-------------------------------------------------------------------------------  

如果是个# ,就会出现跳到顶部的情况,个人收藏的几种解决方法:

1:<a href="####"></a> 
2:<a href="javascript:void(0)"></a>
3:<a href="javascript:void(null)"></a>
4:<a href="#" onclick="return false"></a> 
5:<span style="cursor:hand"></span>(好像在FF中不能显示)

-------------------------------------------------------------------------------

以上内容是小编给大家介绍的javascript:void(0)是什么意思及href=#与href=javascriptvoid(0)的区别,希望对大家有所帮助。

Javascript 相关文章推荐
IE与firefox之jquery用法区别
Oct 03 Javascript
Mootools 1.2教程 同时进行多个形变动画
Sep 15 Javascript
jquery text(),val(),html()方法区别总结
Nov 04 Javascript
JavaScript中for-in遍历方式示例介绍
Feb 11 Javascript
JavaScript中常见的字符串操作函数及用法汇总
May 04 Javascript
JS深度拷贝Object Array实例分析
Mar 31 Javascript
Vue2.0父组件与子组件之间的事件发射与接收实例代码
Sep 19 Javascript
Node做中转服务器转发接口
Oct 18 Javascript
vue生命周期实例小结
Aug 15 Javascript
微信小程序使用for循环动态渲染页面操作示例
Dec 25 Javascript
vue axios重复点击取消上一次请求封装的方法
Jun 19 Javascript
layui 地区三级联动 form select 渲染的实例
Sep 27 Javascript
每天一篇javascript学习小结(Date对象)
Nov 13 #Javascript
有关Promises异步问题详解
Nov 13 #Javascript
以jQuery中$.Deferred对象为例讲解promise对象是如何处理异步问题
Nov 13 #Javascript
Jquery promise实现一张一张加载图片
Nov 13 #Javascript
jquery转盘抽奖功能实现
Nov 13 #Javascript
javascript生成随机数方法汇总
Nov 12 #Javascript
js正则表达式验证邮件地址
Nov 12 #Javascript
You might like
为php4加入动态flash文件的生成的支持
2006/10/09 PHP
解决dede生成静态页和动态页转换的一些问题,及火车采集入库生成动态的办法
2007/03/29 PHP
非常精妙的PHP递归调用与静态变量使用
2012/12/16 PHP
php提示Failed to write session data错误的解决方法
2014/12/17 PHP
PHP实现的redis主从数据库状态检测功能示例
2017/07/20 PHP
PHP与Web页面的交互示例详解二
2020/08/04 PHP
js+html5获取用户地理位置信息并在Google地图上显示的方法
2015/06/05 Javascript
JS基于FileSystemObject创建一个指定路径的TXT文本文件
2015/08/05 Javascript
整理Javascript基础语法学习笔记
2015/11/29 Javascript
Bootstrap字体图标无法正常显示的解决方法
2016/10/08 Javascript
浅谈express 中间件机制及实现原理
2017/08/31 Javascript
使用Vue写一个datepicker的示例
2018/01/27 Javascript
jQuery实现模糊查询的方法分析
2018/05/10 jQuery
浅析JS中回调函数及用法
2018/07/25 Javascript
vue通过cookie获取用户登录信息的思路详解
2018/10/30 Javascript
JS实现处理时间,年月日,星期的公共方法示例
2019/05/31 Javascript
[01:54]TI珍贵瞬间系列(三):翻盘
2020/08/28 DOTA
python转换摩斯密码示例
2014/02/16 Python
Python中shutil模块的学习笔记教程
2017/04/04 Python
Python工厂函数用法实例分析
2018/05/14 Python
Python实现爬虫爬取NBA数据功能示例
2018/05/28 Python
Python 写入训练日志文件并控制台输出解析
2019/08/13 Python
详解基于python的多张不同宽高图片拼接成大图
2019/09/26 Python
python Popen 获取输出,等待运行完成示例
2019/12/30 Python
解决Python paramiko 模块远程执行ssh 命令 nohup 不生效的问题
2020/07/14 Python
css3和jquery实现自定义checkbox和radiobox组件
2014/04/22 HTML / CSS
高性能钓鱼服装:Huk Gear
2019/02/20 全球购物
英国哈罗德园艺:Harrod Horticultural
2020/03/31 全球购物
毕业生求职简历中的自我评价
2013/10/18 职场文书
小学母亲节活动方案
2014/03/14 职场文书
客户答谢会致辞
2015/01/20 职场文书
天坛导游词
2015/02/02 职场文书
工程质量保证书
2015/05/09 职场文书
秋季运动会加油词
2015/07/18 职场文书
导游词之广西漓江
2019/11/02 职场文书
golang中的并发和并行
2021/05/08 Golang