Bootstrap 中的“提交”按钮滚动到顶部

Question

我使用 Twitter 的 Bootstrap 框架创建了一个单页投资组合模板。我遇到一个问题，当我点击联系表单中的“提交”按钮时，页面一直滚动到顶部。我已经检查过我没有使用任何内部链接到顶部，所以我不确定为什么会发生这种情况。我的意图是保持在同一页面上并向用户展示一些友好的信息。谁能帮我解决这个问题？提前致谢！

模板可在以下位置访问：

https://rawgit.com/gupta235/portfolio_template_bootstrap/master/index.html

我已在我的 github 页面上提供了该模板：https://github.com/gupta235/portfolio_template_bootstrap

Answer 1

表单通常会将您带到一个新页面。由于您的表单都在一个页面中，因此将您发送到的“新页面”与您之前所在的页面相同，因此它会将您发送到该页面的第一部分，即顶部。

您可以通过为表单提供操作功能来防止页面滚动到顶部，而不是将您发送到新页面或当前页面的顶部，而是将您带到您放置在页面某处的 id .

与在您的页面上放置一个锚点并让人们选择点击一个链接将他们带到页面的特定部分的概念相同。

例如，如果您将表单打开代码从

<form method="post">

改为这个

<form method="post" action="#error-check" id="error-check">

这应该会在您点击提交时将您带到表单，而不是页面顶部。

Answer 2

根据标准，没有 action 属性的表单不是表单 - 实际上会在某些浏览器中导致页面重新加载。我发现 action="javascript:void(0);"效果很好。