为了账号安全,请及时绑定邮箱和手机立即绑定

点击页面底部的a标签为啥滚动条会滚到页面顶端?

点击页面底部的a标签为啥滚动条会滚到页面顶端?

萧十郎 2018-09-07 13:16:12
页面就是这么简单!为啥a标签点击后滚动条会滚到页面顶端?<!DOCTYPE html><html><head>    <meta charset="UTF-8">    <title>jshint</title>    <style type="text/css">        body{            height:1500px;        }        #fill{            width:1000px;            height:1000px;        }        #a{            display: block;            width:300px;            height:30px;            border:5px solid black;        }    </style></head><body><div id="fill"></div><a href="" id="a">点我改变边框颜色</a><script type="text/javascript">    document.getElementById('a').onclick = function () {        this.style.cssText = 'border:5px solid red;'    };</script></body></html>
查看完整描述

1 回答

?
智慧大石

TA贡献1946条经验 获得超3个赞

这是一个必需属性为锚定义一个超文本链接来源。这表示链接目标的URL或URL片段。URL片段是由一个hash符号(#),它指定一个内部目标在当前文档中的位置(ID)开头的名字。URL不限于网页(HTTP)的文件。URL可能使用浏览器所支持的任何协议。例如,文件,FTP,大多数用户代理mailto工作。

你在href里面置空,相当于给定了一个空的URI,然后浏览器默认合并当前的URL,最后生成了和当前URL一样的一个PATH,然后就跳转至这个PATH,然后就相当于刷新了当前页面。可能由于你本地或者缓存,这个刷新的操作很快,以至于让你有了滚动到顶部的错觉。

解决办法通常是加#或者javascript:void(0),或者给这个a标签绑定js的click事件,再阻止默认。


查看完整回答
反对 回复 2018-10-27
  • 1 回答
  • 0 关注
  • 868 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信