Question

由于某些我不知道的原因，链接到我网页的某个部分的id属性在点击后会卡在网址中。

<a href="#second" button class="btn">Click Here To Pre-Order</button></a>

<a id="second"></a>

要查看我的意思的实际示例，请访问[plushvip.com 1，点击第一个按钮查看我的意思。

有什么想法吗？

Answer 1

尝试使用此代码段。

<button class="btn"><a href="#bottom">Click Here To Pre-Order</a></button>

<a id="bottom"></a>

Answer 2

哈希是如何运作的。如果您重新加载页面浏览器，则尝试查找具有当前哈希值的元素，并将其重点放在其上。如果这不是你想要的，你应该阻止click事件的默认操作，然后文档的哈希值不会被更新，但是你应该选择目标元素使用JavaScript并根据目标元素的顶部偏移更改窗口的滚动位置。

您的标记无效。开场button标记在哪里以及button元素中a元素的原因在哪里？

Answer 3

#1：这应该是如何工作的 #2：正如另一个称为哈希的答案中所述，您可以使用jquery来修复它。我喜欢这个小脚本它删除了哈希，并且有一个很好的滚动动画而不是跳跃：
JQuery的：

jQuery(document).ready(function($) {
    $(".scroll").click(function(event) {
       event.preventDefault();
       $('html,body').animate( { scrollTop:$(this.hash).offset().top } , 1000);
    });
});

HTML：

<a href="#second" class="scroll" >
<button class="btn">Click Here To Pre-Order</button>
</a>

演示：
http://jsfiddle.net/ImagineStudios/c604vbrn/11/

从我的网址中删除id属性以进行链接

3 个答案: