我使用Twitter的Bootstrap框架创建了单页组合模板。我遇到一个问题,当我点击"提交"按钮在联系表单中,页面一直滚动到顶部。我已经检查过我没有使用任何内部链接到顶部所以我不确定为什么会发生这种情况。我的目的是留在同一页面,并向用户显示一些友好的消息。任何人都可以帮我解决这个问题吗?提前谢谢!
可以在以下网址访问模板:
https://rawgit.com/gupta235/portfolio_template_bootstrap/master/index.html
我已在我的github页面上提供了该模板:https://github.com/gupta235/portfolio_template_bootstrap
答案 0 :(得分:1)
表单通常会将您转到新页面。由于您的表单全部在一个页面中,因此"新页面"它发送给你的是你已经使用的那个,所以它会把你送到那个页面的第一部分,这是最好的。
您可以通过为表单提供一种操作功能来阻止页面滚动到顶部,而不是将您发送到新页面或当前页面的顶部,而是会将您带到您放置在页面某处的ID 。
与在页面上放置锚点并让人们选择单击链接以将其带到页面的某个部分相同的概念。
例如,如果您从
更改表单打开代码<form method="post">
改为
<form method="post" action="#error-check" id="error-check">
当您点击提交而不是页面顶部时,这会将您带到表单。
答案 1 :(得分:1)
根据标准,没有action属性的表单不是表单 - 实际上会在某些浏览器中导致页面重新加载..我发现action =&#34; javascript:void(0); &#34;效果很好。