在谷歌表单中按下提交按钮后如何使页面滚动到顶部？答案

【问题标题】：How to make page scroll to top after submit button is pressed in google form?在谷歌表单中按下提交按钮后如何使页面滚动到顶部？
【发布时间】：2020-01-17 17:44:38
【问题描述】：

我在我的网站上使用了谷歌表单。我在按下提交按钮时遇到问题，页面没有转到顶部并显示很多空白区域，因为我们必须在提交表单时进行很多操作。

这是我使用的表格： <iframe src="https://docs.google.com/forms/d/e/1FAIpQLSc2zeeSoq25ZdSkWK5bY5uwp6NJ4r-PdzILlXAeuszyVwQlMA/viewform?embedded=true" width="100%" height="1800px" frameborder="0" marginheight="0" marginwidth="0">Loading…</iframe>

使用此代码，但它不起作用。 <form onsubmit="parent.scrollTo(0, 0); return true">

注意：我不了解 JS 或 Jquery，所以我可能需要一些详细的解释。谢谢你

【问题讨论】：

标签： javascript jquery html css google-forms

【解决方案1】：

您可以使用两个选项。

将 jquery 脚本添加到 iframe 加载事件

<script>
  jQuery("iframe").load(function() {
    jQuery("html,body").animate({
      scrollTop: 0
    }, "slow");
  });
</script>

在 iframe 中添加 onload 事件； onload="window.parent.scrollTo(0,0)"

< iframe src = "https://docs.google.com/forms/d/e/1FAIpQLSc2zeeSoq25ZdSkWK5bY5uwp6NJ4r-PdzILlXAeuszyVwQlMA/viewform?embedded=true"
  width = "100%"
  height = "1800px"
  frameborder = "0"
  marginheight = "0"
  marginwidth = "0"
  onload = "window.parent.scrollTo(0,0)" >
    Loading… 
</iframe>

推荐使用第二个选项，因为它适用于带有多页。

【讨论】：

【解决方案2】：

我遇到了类似的问题。在尝试一些建议时，我遇到了一个解决方案。这个 JavaScript 解决方案就像 Flask 中的魅力一样。在您的 HTML 文件中，考虑粘贴此脚本，即 iframe 之后的部分。

<script>
document.querySelector("iframe").addEventListener("load", 
    function() {
        window.scrollTo({
    top: 0,
    left: 0,
    behavior: 'smooth'
  });
});

</script>

【讨论】：

【解决方案3】：

这应该解决它：

<iframe src="iframe.url.com" onload="loaded()"></iframe>
<script type="application/javascript">
  var loadCounter = 0;
  var loaded = function () {
  loadCounter += 1;
  if (loadCounter === 2) {
    window.scrollTo({top: 550, left: 0, behavior: 'smooth'});
  }
}
</script>

【讨论】：

【解决方案4】：

您可以在提交按钮上使用href="#header" 并输入标题部分的ID，它会滚动到顶部。 ^-^

<div id="header"></div>
<button href="#header">Submit</button>

【讨论】：

实际上，正如我提到的，我使用了谷歌表单，所以我无法将 href 添加到按钮标签。
哦，我明白了...你能告诉我其余的表格代码吗？