最近在开发一个小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. 委托与Lambda-浅谈

    委托概述 委托是寻址方法的.NET版本. 在C++中,函数指针只不过是一个指向内存位置的指针,它不是类型安全的.我们无法判断这个指针实际指向什么,更不知晓像参数和返回类型等项了. 而.NET委托完全不 ...

  2. C# 导出word文档及批量导出word文档(4)

          接下来是批量导出word文档和批量打印word文件,批量导出word文档和批量打印word文件的思路差不多,只是批量打印不用打包压缩文件,而是把所有文件合成一个word,然后通过js来调用 ...

  3. n!(n的阶乘)

    我们在这里介绍一些关于n!的性质. 在计数问题中,经常需要用到n!.有必要了解n!在mod p下的一些性质.下面我们假设p是素数,n!=ape(a无法被p整除),并试图求解e和a mod p(把这个东 ...

  4. HDU4545+计算日期

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

  5. gcd - b- 201611302317

    谈到iOS多线程,一般都会谈到四种方式:pthread.NSThread.GCD和NSOperation.其中,苹果推荐也是我们最经常使用的无疑是GCD.对于身为开发者的我们来说,并发一直都很棘手,如 ...

  6. 解压和生成 system.img&data.img ( ext4格式)

    另一篇文章讲述了如何解压和生成system.img, 那是针对yaffs2格式的文件系统镜像. 目前越来越多的Android手机放弃了nand, 更多采用了emmc为内部存储设备. 以emmc为存储设 ...

  7. WPF中的换行符

    原文:WPF中的换行符 WPF中UI上和后台代码中的换行符不同. 其中: XAML中为 C#代码中为 \r\n 或者: Environment.NewLine 版权声明:本文为博主原创文章,未经博主允 ...

  8. logstash 利用drop 丢弃过滤日志

    input { stdin { } } filter { grok { match => ["message","\s*%{TIMESTAMP_ISO8601}\s ...

  9. bzoj1626[Usaco2007 Dec]Building Roads 修建道路

    Description Farmer John最近得到了一些新的农场,他想新修一些道路使得他的所有农场可以经过原有的或是新修的道路互达(也就是说,从任一个农场都可以经过一些首尾相连道路到达剩下的所有农 ...

  10. windows oid 利用SNMP获得主机信息(转)

    该博文转至:http://blog.sina.com.cn/s/blog_853cc55b0101a2mq.html Windows OID' for CPU, Memory, Disk Utiliz ...