最近在开发一个小web的时候想给一个按钮增加一个弹出dialog功能，但是发现点击按钮后页面总是自动滚动至顶部，这点从用户体验上来讲是极其不爽的，于是开始跳进google大池寻求解决办法。网上的办法有很多，但是唯独下面这个生效了，转来收藏。

    "平时开发的HTML表单，链接通常会使用<a href="#" onclick="openWnd();">Open new window</a>控件，但这种方法如果是链接到本页面，用来执行一段JS脚本的话，我们一般不希望用户在点解链接后页面滚动到顶部（如果有滚动条的话），可以通过修改上述将链接属性href来实现：即将href="#"改为href="###"，这样用户点击链接执行JS脚本后，滚动条就不会自动跳到TOP了。"

后来就想为什么这么改了就不跳了？然后把href换成 "#X"，发现依然可以实现阻止滚动的效果。所以应该是浏览器会把 "#" 当作是一种页面跳转的口令，接到这个口令就会把页面滚动到原始位置，但是只要把这个改成浏览器没有办法识别的名称，那么它就会把这个口令ignore了。

NOTE：后来发现IE6这个神奇的浏览器连"##"都能识别，所以如果你要兼容浏览器，那还是用"###"吧。。。

2010-10-11 更新

在最近开发的网站中，一直使用上述的"#X"方法解决页面跳动的问题。但是这样解决页面虽然不跳了，url却会变得异常的难看，所以一直想找个方法替代它。后来在一次山寨之旅中意外的找到了它——

                            href="javascript:void(0)"

url从此干净了~~

除此方法之外还有提出：

定位到 <html> 上，document.getElementsByTagName( "html ")[0].style.overflow= "hidden " 
或者 <html   id= "scroll "> 
然后调用地方写document.getElementById( "scroll ").style.overflow= "hidden "

点击<a>标签，禁止页面自动跳到顶部的解决办法的更多相关文章

  1. 所有浏览器打开后自动打开115.29.163.152/404.html这个网页，然后自动跳转到hao123 解决办法

    这几天,电脑所有浏览器打开后自动打开115.29.163.152/404.html这个网页,然后自动跳转到hao123这个网页,网上查询没解决办法.开始自己找,搜索注册表,都无效,最后下载软件Hija ...

  2. HTML实现页面自动跳转的五种方法

    下面列了五个例子来详细说明,这几个例子的主要功能是:在5秒后,自动跳转到同目录下的hello.html(根据自己需要自行修改)文件. 1)html的实现 复制代码 代码如下: <head> ...

  3. JAVA-JSP内置对象之response对象实现页面自动跳转

    相关资料:<21天学通Java Web开发> response对象 实现页面自动跳转1.可以通过response对象的addHeader()方法添加一个标题为Refresh的标头,并指定页 ...

  4. 关于vscode自动跳转回车的解决方法（关闭vscode自动保存功能；可能和其他插件有冲突）

    关于vscode自动跳转回车的解决方法(关闭vscode自动保存功能:可能和其他插件有冲突)

  5. jquery 的ajax无刷新上传文件之后，页面还是会莫名的刷新-----解决办法

    文件上传用到全局数组: $_FILES 只需要把下面的 <button onclick="post()">提交</button> 改为 <input ...

  6. UltraEdit 标签（tab）不见的3个解决办法

    UltraEdit 标签(tab)不见的3个解决办法 2010-11-08 09:19 1042人阅读 评论(0) 收藏 举报 工具c 方法1:点 视图->视图/列表(V)->打开文件标签 ...

  7. HTTP 错误 500.19 请求的页面的相关配置数据无效 解决办法

    "HTTP 错误 500.19 请求的页面的相关配置数据无效" 解决办法   HTTP 错误 500.19 - Internal Server Error无法访问请求的页面,因为该 ...

  8. xcode4 语法高亮和自动补全失效的解决办法

    xcode4 语法高亮和自动补全失效的解决办法xcode4有一个bug,某些时候会造成类名的着色显示不出来,还有就是代码补全不能完全显示,而且没有参数. 解决方法: 首先关闭项目窗口,然后到Organ ...

  9. pycharm自动调整html页面代码缩进不正确的解决办法

    pycharm自动调整html页面代码缩进不正确的解决办法

随机推荐

  1. JavaScript和ajax 跨域的案例

    今天突然想看下JavaScript和ajax 跨域问题,然后百度看了一下,写一个demo出来 <!DOCTYPE html> <html xmlns="http://www ...

  2. jq不识别拼接的对象id的解决方案

    今天在做项目时,遇到了这么个问题. 先声明一下,我的id都是动态变换的.从1-10呢. <div id="a1"></div> <div id=&qu ...

  3. HDU4545+计算日期

    /* 计算过了D天后的日期 之前D天的日期 */ #include<stdio.h> int judge_year( int year ){ if( (year%4==0&& ...

  4. HTML5画布（阴影）

    案例1: <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8& ...

  5. CSS太阳月亮地球三角恋旋转效果

    纯粹玩一下,好像没有什么实际的卵用,but,纯玩买不了上当,纯玩买不了受骗........ 地月旋转的一个css效果,无聊玩玩,可以复制到记事本试试 <!DOCTYPE html>< ...

  6. 整型（int）转时间格式字符串及页面long型转时间格式字符串

    1,如果是封装的整型的话需要在后台进行处理再返回页面 处理过程是这样的 SimpleDateFormat sdf=new SimpleDateFormat("yyyy-MM-dd HH:mm ...

  7. Markdown简短教程

    前言 很早以前就已经接触到Markdown语言,由于各种原因到今天才认真的学习.其实Markdown语言还是比较简单的,在用中学就可以了. 正文 本文只是介绍而没有说明其它可选语法,详细可以参考[Ma ...

  8. 破解官方recovery的签名验证

    步骤简述1.解包recovery.img,2.反编译/sbin/recovery,用ida64plus3.在反编译出来的文本中查找:signature 4.简单的看一下指令流程,CBZ下面是faile ...

  9. Eclipse远程调试weblogic

    http://www.cnblogs.com/dyllove98/archive/2013/08/06/3241140.html http://blog.csdn.net/afgasdg/articl ...

  10. 抗忙，，建个MAVEN的私服仓库-NEXUS

    公司最近需求越来越上轨道,MAVEN的私服仓库-NEXUS构架起来哟.. 参考文档URL: http://www.linuxidc.com/Linux/2011-07/39578p3.htm http ...