最近在开发一个小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. Oracle物理结构与逻辑结构

    有一张图能非常清晰的表示出Oracle物理结构与逻辑结构的区别:如下图:   对上图的解释:每个数据库都必须由一个或多个表空间组成.(一对多关系)每个表空间都必须由一个或多个数据文件(data fil ...

  2. Objective-C 异常处理

    #import <UIKit/UIKit.h> #import "AppDelegate.h" int main(int argc, char * argv[]) { ...

  3. 转载：css3 box-shadow投影发光效果

    转载网址:http://www.wufangbo.com/css3-box-shadow/ CSS3的box-shadow属性 可以让我们轻松实现图层阴影效果.我们来实战详解一下这个属性. 1. bo ...

  4. lnmp源码安装以及简单配置

    nginx 软件: a: openssl-1.0.1r.tar.gz tar zxf openssl-1.0.1r.tar.gz b: pcre-8.32.tar.gz tar zxf openssl ...

  5. U盘装系统系列一—-安装老毛桃U盘启动制作工具

    今天跟大家分享下如何制作U盘启动盘,通过U盘启动来安装操作系统.U盘便于携带,同时能解决光驱出问题装不了系统的麻烦,可谓是装机利器!我一直用的都是老毛桃的U盘启动制作工具,很好用,很强大,就以它来演示 ...

  6. linux 下进程状态及进程控制

    系统状态检测及进程控制1,/proc 是系统的一个窗户,可以透视内核2,建议将hosts里localhost,locahost.locadomain 解析为127.0.0.1 把系统域名解决为局域网的 ...

  7. 我和小美的撸码日记(2)之第一个基于MVC+Jqgrid的列表页面

    一.前言 “尼玛哥,上周你教我改了下OA系统UI,黄总看了很满意呀.”    “不错不错,看来小美进步很大,可以提前结束试用期,到时候加工资别忘了请我吃饭呀!”    “尼玛哥,你有女朋友了吗?” “ ...

  8. Scala学习笔记--Actor和并发

    感谢博主lyrebing  博文地址:http://blog.csdn.net/lyrebing/article/details/20446061 1.  Actor用法 1.1 Actor的基本使用 ...

  9. 开始慢慢学习这本书了。。Python编程实战：运用设计模式、并发和程序库创建高质量程序

    没办法,不到设计模式,算法组合这些,在写大一点程序的时候,总是力不从心...:( 一开始可能要花很多时间来慢慢理解吧,,这毕竟和<大话设计模式>用的C#语言有点不太一样... 书上代码是3 ...

  10. FJ省队集训DAY5 T1

    思路:考试的时候打了LCT,自以为能过,没想到只能过80.. 考完一想:lct的做法点数是100W,就算是nlogn也会T. 讲一下lct的做法把:首先如果一条边连接的两个点都在同一个联通块内,那么这 ...