URL地址中的#符号使用说明


Posted in Javascript onFebruary 12, 2011

一般我们想让一个a标签点击后执行javascript代码,有以下几种写法:
方式一:<a href="#" onclick="alert(1);">点击一</a>
这种方式的缺点就是点击后会在地址栏的URL后面加#号,同时把页面移动到顶部,一般不建议使用。
方式二:<a href="javascript:void(0);" onclick="alert(1);">点击一</a>
这种方式避免了方式一的缺点,点击后对页面没有任何影响。但是有一个致命的缺点,就是在IE6下不能执行form对象的submit()方法,也不能执行跳转语句,比如
<a href="javascript:void(0);" onclick="document.forms[0].submit();">点击一</a>
<a href="javascript:void(0);" onclick="window.location.href='http://www.google.com';">点击一</a>
在IE6下就无效,换成href=”#”就能在IE6下正常执行。

方式三:<a href="###" onclick="alert(1);">点击一</a>
点击后虽然会在地址栏的URL后面加三个#号,但是不会影响滚动条,同时在IE6下也能执行form对象的submit()方法与跳转语句,算是一个比较折中的方法。

结论:我个人认为如果执行的javascript方法中需要提交表单、跳转页面,则用方式三,其它情况都用方式二。

另:这又附带引出另一个问题,一般重新加载当前页面用如下的javascript代码:
window.location.href = window.location.href;
但是当URL地址中含有#时,上述代码无效,于是需要用如下代码:
window.location.href = window.location.href.split('#')[0];
将URL地址以#符号分割开,取第一部分即可。

在很多情况下/index.htm#desc,后面的desc可能就是参数,不容易的参数显示不同的内容,不是简单锚点,而是ajax读取内容。

Javascript 相关文章推荐
用javascript动态调整iframe高度的代码
Apr 10 Javascript
js 颜色选择器(兼容firefox)
Mar 05 Javascript
jquery text()要注意啦
Oct 30 Javascript
跟着Jquery API学Jquery之一 选择器
Apr 07 Javascript
Script标签与访问HTML页面详解
Jan 10 Javascript
JQuery中使文本框获得焦点的方法实例分析
Feb 28 Javascript
js与jquery正则验证电子邮箱、手机号、邮政编码的方法
Jul 04 Javascript
利用jQuery插件imgAreaSelect实现图片上传裁剪(放大缩小)
Dec 02 Javascript
vue+springmvc导出excel数据的实现代码
Jun 27 Javascript
elementUI多选框反选的实现代码
Apr 03 Javascript
vue keep-alive列表页缓存 详情页返回上一页不刷新,定位到之前位置
Nov 26 Javascript
Node.js实现批量下载图片简单操作示例
Jan 18 Javascript
基于Jquery制作的幻灯片图集效果打包下载
Feb 12 #Javascript
基于jquery的jqDnR拖拽溢出的修改
Feb 12 #Javascript
jQuery1.4.2与老版本json格式兼容的解决方法
Feb 12 #Javascript
在vs2010中调试javascript代码方法
Feb 11 #Javascript
juqery 学习之六 CSS--css、位置、宽高
Feb 11 #Javascript
juqery 学习之五 文档处理 包裹、替换、删除、复制
Feb 11 #Javascript
juqery 学习之五 文档处理 插入
Feb 11 #Javascript
You might like
ThinkPHP 3.2 数据分页代码分享
2014/10/14 PHP
PHP Header用于页面跳转时的几个注意事项
2016/10/21 PHP
Thinkphp框架中D方法与M方法的区别
2016/12/23 PHP
给文字加上着重号的JS代码
2013/11/12 Javascript
javascript操作css属性
2013/12/30 Javascript
webapp框架AngularUI的demo改造之路
2014/12/21 Javascript
jQuery前端分页示例分享
2015/02/10 Javascript
JavaScript数据库TaffyDB用法实例分析
2015/07/27 Javascript
Node.js程序中的本地文件操作用法小结
2016/03/06 Javascript
详解Javascript继承的实现
2016/03/25 Javascript
15个值得开发人员关注的jQuery开发技巧和心得总结【经典收藏】
2016/05/25 Javascript
深入理解ES6的迭代器与生成器
2017/08/19 Javascript
微信小程序收藏功能的实现代码
2018/06/12 Javascript
在 Vue.js中优雅地使用全局事件的方法
2019/02/01 Javascript
layui table设置某一行的字体颜色方法
2019/09/05 Javascript
electron 安装,调试,打包的具体使用
2019/11/06 Javascript
python中的对象拷贝示例 python引用传递
2014/01/23 Python
python实现带错误处理功能的远程文件读取方法
2015/04/29 Python
教你利用Python玩转histogram直方图的五种方法
2018/07/30 Python
Python3数字求和的实例
2019/02/19 Python
Python3转换html到pdf的不同解决方案
2019/03/11 Python
Python MongoDB 插入数据时已存在则不执行,不存在则插入的解决方法
2019/09/24 Python
Python3.8对可迭代解包的改进及用法详解
2019/10/15 Python
使用Django和Postgres进行全文搜索的实例代码
2020/02/13 Python
python利用线程实现多任务
2020/09/18 Python
介绍一下linux的文件系统
2012/03/20 面试题
档案工作汇报材料
2014/08/21 职场文书
法英专业大学生职业生涯规划范文:衡外情,量己力!
2014/09/23 职场文书
家庭困难证明
2014/10/12 职场文书
2015年感恩母亲节的演讲稿
2015/03/18 职场文书
客户经理岗位职责大全
2015/04/09 职场文书
2015年公司后勤管理工作总结
2015/05/13 职场文书
话题作文之财富(600字)
2019/12/03 职场文书
Python list列表删除元素的4种方法
2021/11/01 Python
《王者天下》第4季首话新剧照 4月9日正式开播
2022/04/07 日漫
浅析JavaScript中的变量提升
2022/06/01 Javascript