解决问题:点击a链接时,出现了竖滚动条向下跳动的情况

解决问题:点击a链接时,出现了竖滚动条向下跳动的情况

本人出现的问题是,有一个a链接,有跳转页面的和不跳转页面的,在点击a链接时,竖滚动条莫名其妙的向下滚动,导致了跳转页面后,新页面的滚动条不在顶部。

以下是我的a链接代码

<a href="#" onclick="jumpToOtherPage()">这是跳转链接</a>

后来我发现的原因是 href="#" 造成的,这个属性产生的作用是某个标签到达顶部。
这里要先说明一下我的页面结构,是经典三层结构,就是页面是上左中分布。
点击了中部(即div)的链接后,中部div向上到顶部,但是本来中部div和顶部是有一段距离的,就是上(导航栏)的宽度。这样,就使竖滚动条向下跳动的效果。

解决办法

将点击事件写到href属性中,如下

<a href="javascript:jumpToOtherPage()">这是跳转链接</a>

这样就可以解决问题。

还有,如果直接把#去掉,像如下写法

<a href="" onclick="jumpToOtherPage()">这是跳转链接</a>

那么,连点击事件也没有发生,页面没有跳转。

如果大家知道为什么 <a href="#" onclick="jumpToOtherPage()">这是跳转链接</a> 会产生竖滚动条向下跳动情况的原因和 <a href="" onclick="jumpToOtherPage()">这是跳转链接</a> 页面没有跳转的原因,欢迎大家在评论中说明。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值