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 AJAX 调用WebService实现代码
Mar 24 Javascript
dtree 网页树状菜单及传递对象集合到js内,动态生成节点
Apr 14 Javascript
jQuery.each()用法分享
Jul 31 Javascript
Javascript 数组排序详解
Oct 22 Javascript
js获取数组的最后一个元素
Apr 14 Javascript
在AngularJS应用中实现一些动画效果的代码
Jun 18 Javascript
Jquery-1.9.1源码分析系列(十一)之DOM操作
Nov 25 Javascript
Javascript将双字节字符转换成单字节字符并计算长度
Jun 22 Javascript
jQuery dataTables与jQuery UI 对话框dialog的使用教程
Sep 02 Javascript
微信小程序 传值取值的几种方法总结
Jan 16 Javascript
vue-router判断页面未登录自动跳转到登录页的方法示例
Nov 04 Javascript
vue el-tree 默认展开第一个节点的实现代码
May 15 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
汉字转化为拼音(php版)
2006/10/09 PHP
使用php记录用户通过搜索引擎进网站的关键词
2014/02/13 PHP
php判断并删除空目录及空子目录的方法
2015/02/11 PHP
PHP实现数组array转换成xml的方法
2016/07/19 PHP
baidu博客的编辑友情链接的新的层窗口!经典~支持【FF】
2007/02/09 Javascript
基于Jquery的表格隔行换色,移动换色,点击换色插件
2010/12/22 Javascript
javascript中创建对象的三种常用方法
2010/12/30 Javascript
javascipt基础内容--需要注意的细节
2013/04/10 Javascript
js 触发select onchange事件代码
2014/03/20 Javascript
js打造数组转json函数
2015/01/14 Javascript
jQuery控制文本框只能输入数字和字母及使用方法
2016/05/26 Javascript
浅析$.getJSON异步请求和同步请求
2016/06/06 Javascript
Angularjs的Controller间通信机制实例分析
2016/11/07 Javascript
Vue.js系列之项目结构说明(2)
2017/01/03 Javascript
JS加密插件CryptoJS实现的Base64加密示例
2020/08/16 Javascript
laravel实现中文和英语互相切换的例子
2019/09/30 Javascript
Layui数据表格判断编辑输入的值,是否为我需要的类型详解
2019/10/26 Javascript
vue项目中极验验证的使用代码示例
2019/12/03 Javascript
uniapp 仿微信的右边下拉选择弹出框的实现代码
2020/07/12 Javascript
利用Vue实现简易播放器的完整代码
2020/12/30 Vue.js
[01:26]DOTA2荣耀之路2:iG,China
2018/05/24 DOTA
Python中文分词实现方法(安装pymmseg)
2016/06/14 Python
pytorch载入预训练模型后,实现训练指定层
2020/01/06 Python
关于tf.reverse_sequence()简述
2020/01/20 Python
pytorch实现从本地加载 .pth 格式模型
2020/02/14 Python
PyCharm设置Ipython交互环境和宏快捷键进行数据分析图文详解
2020/04/23 Python
美国女性奢华品牌精品店:INTERMIX
2017/10/12 全球购物
为您的家、后院、车库等在线购物:Spreetail
2019/06/17 全球购物
德国高尔夫商店:Par71.de
2020/11/29 全球购物
OLEDBConnection和SQLConnection有什么区别
2013/05/31 面试题
利达恒信公司.NET笔试题面试题
2016/03/05 面试题
《美丽的黄昏》教学反思
2014/02/28 职场文书
精神文明建设先进个人事迹材料
2014/12/24 职场文书
寒假社会实践个人总结
2015/03/06 职场文书
导游词之张家口
2019/12/13 职场文书
MySQL优化及索引解析
2022/03/17 MySQL