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 相关文章推荐
jQuery 行级解析读取XML文件(附源码)
Oct 12 Javascript
jquery validate poshytip 自定义样式
Nov 26 Javascript
深入探讨JavaScript、JQuery屏蔽网页鼠标右键菜单及禁止选择复制
Jun 10 Javascript
编写简单的jQuery提示插件
Dec 21 Javascript
Jquery实现图片预加载与延时加载的方法
Dec 22 Javascript
jquery Ajax 全局调用封装实例详解
Jan 16 Javascript
jquery事件与绑定事件
Mar 16 Javascript
jQuery+pjax简单示例汇总
Apr 21 jQuery
JS实现的简单表单验证功能完整实例
Oct 14 Javascript
在vue 中使用 less的教程详解
Sep 26 Javascript
vue实现tab栏点击高亮效果
Aug 19 Javascript
ajax请求前端跨域问题原因及解决方案
Oct 16 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
超神学院:鹤熙已踏入神圣领域,实力不比凯莎弱
2020/03/02 国漫
php格式化日期实例分析
2014/11/12 PHP
php生成二维码
2015/08/10 PHP
PHP函数import_request_variables()用法分析
2016/04/02 PHP
Yii 2.0实现联表查询加搜索分页的方法示例
2017/08/02 PHP
两种简单实现菜单高亮显示的JS类代码
2010/06/27 Javascript
javascript实现的HashMap类代码
2014/06/27 Javascript
JQuery判断radio是否选中并获取选中值的示例代码
2014/10/17 Javascript
JavaScript操作Cookie方法实例分析
2015/05/27 Javascript
jQuery常用且重要方法汇总
2015/07/13 Javascript
浏览器兼容性问题大汇总
2015/12/17 Javascript
详解JavaScript中Hash Map映射结构的实现
2016/05/21 Javascript
jQuery限制图片大小的方法
2016/05/25 Javascript
JS中append字符串包含onclick无效传递参数失败的解决方案
2016/12/26 Javascript
jquery横向纵向鼠标滚轮全屏切换
2017/02/27 Javascript
JavaScript下拉菜单功能实例代码
2017/03/01 Javascript
jquery图片放大镜效果
2017/06/23 jQuery
利用yarn代替npm管理前端项目模块依赖的方法详解
2017/09/04 Javascript
vue 单页应用和多页应用的优劣
2020/10/22 Javascript
python实现汉诺塔递归算法经典案例
2021/03/01 Python
详解Python操作RabbitMQ服务器消息队列的远程结果返回
2016/06/30 Python
使用Python对Csv文件操作实例代码
2017/05/12 Python
python for和else语句趣谈
2019/07/02 Python
python groupby 函数 as_index详解
2019/12/16 Python
详解webapp页面滚动卡顿的解决办法
2018/12/26 HTML / CSS
Prototype如何实现页面局部定时刷新
2013/08/06 面试题
3D空间设计学生找工作的自我评价
2013/10/28 职场文书
挑战杯创业计划书的写作指南
2014/01/07 职场文书
招聘单位介绍信
2014/01/14 职场文书
2014年母亲节寄语
2014/05/07 职场文书
文明和谐家庭事迹材料
2014/05/18 职场文书
写给父母的感谢信
2015/01/22 职场文书
同事打架检讨书
2015/05/06 职场文书
中学生打架《检讨书》范文
2019/08/12 职场文书
攻略丨滑雪究竟该选哪款对讲机?
2022/02/18 无线电
Java 超详细讲解设计模式之中的抽象工厂模式
2022/03/25 Java/Android