最近在开发一个小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. 《大话移动 APP 测试》

    <大话移动 APP 测试> wiki: Software testing 第5章 常用工具介绍和实践 Android.iOS Monkey Android SDK 提供的一个工具:发送伪随 ...

  2. spring-security 登陆认证之初次探究

    首先,希望还对 spring-security框架完全不懂的新手 下载下Git源码. 引入到项目中.这个短文就是边看源码边聊的.也会启动下项目验证自己的推想. 一.登陆认证的登陆配置项 <for ...

  3. linux下登录出现-bash-3.2#解决办法

    1:下载 安装 csh yum  install csh   2:再切换即可  

  4. [C#] 后端post的请求方法

    C# 模拟post请求方法 方法1: /// <summary> /// 模拟Post请求 /// </summary> /// <param name="ur ...

  5. Ftp连接错误

    FTP连接上传 文件报错  windows无法访问此文件夹.请确保输入的文件名是否正确,并且您有权访问此文件.. 解决办法 : IE设置为脱机使用,文件浏览器登录ftp时调用IE浏览器,所以无法连接, ...

  6. jquery多级联动(ajax查数据库)

    /id 代表下级下拉框ID,cityCode代表的是父级菜单代码,所有级菜单在同一张表,后台在加载是把菜单已经加入到Map缓存中.... //id 代表下级下拉框ID,cityCode代表的是父级菜单 ...

  7. HTML&CSS基础学习笔记1.8-预格式文本

    <pre>标签的主要作用是预格式化文本.被包围在 pre 标签中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre>标签的一个常见应用就是用来表示计算机的源代码 ...

  8. Python读取Yaml文件

    近期看到好多使用Yaml文件做为配置文件或者数据文件的工程,随即也研究了下,发现Yaml有几个优点:可读性好.和脚本语言的交互性好(确实非常好).使用实现语言的数据类型.有一个一致的数据模型.易于实现 ...

  9. CVE-2014-3153 com.geohot.towelroot

    futex-prevent-requeue-pi-on-same-futex.patch futex: Forbid uaddr == uaddr2 ) If uaddr == uaddr2, the ...

  10. .a静态库的注意事项

    .a静态库  生成的时候   可以分为  debug 版本  和  release 版本. debug:速度比较慢,比较耗性能.会启动更多的  Xcode 系统监控功能.  对错误的敏感度不高. re ...