Question

我正在尝试提交 HTML表单，同时在屏幕上保留显示页面的内容，并触发浏览器提出要约来保存用户名和密码。

<div id="signInForm" class="init">
  <form> 
    <input id="username" type="text" placeholder="Username">
    <br><br>
    <input id="password" type="password" placeholder="Password">
    <br><br>
    <button type="submit">Sign in</button>  
  </form>  
</div>

我发现，可以通过多种方式保留内容： preventDefault()，onsubmit="return false"，action="javascript:"。

我每个人都成功地完成了工作。但是它们每个都阻止浏览器（Chrome和Edge）提供保存用户名和密码的提议。据我所知，HTML表单在提交时具有默认行为，该行为导航到提交链接。我的理论是，“导航事件”本身就是触发提供保存用户名和密码的提议的原因。如果我是对的，那么达到目标的唯一方法可能是基于让提交以默认方式进行，同时使浏览器以某种方式保留内容。

击中<button type="submit">Sign in</button>之后我得到的所有内容都是空白页。

是否甚至可以通过Apps脚本简单地克服这一问题？还是我缺少基本的东西？

我尝试以编程方式重新加载我的页面，但无法做到这一点。我不知道如何使用reload()。

我已经尝试过：

<!DOCTYPE html>
<html>

  <body>
    <div id="x">I´m ORIGINAL page</div>
    <button onclick="document.getElementById('x').innerHTML= 'I´m EDITED page';">edit page</button>
    <br>
    <button onclick="myFunction()">Reload page</button>
  </body>
  
  <script>
    function myFunction() {
      window.location.reload(true);
    }
  </script>
  
</html>

上面的代码段在Stackoverflow代码段编辑器中对我有效，但在我发布的GAS网络应用程序中无效。

编辑可能最接近解决我问题的方法是这篇文章的答案：Redirecting from doPost() in Google Web App, HTML form with App script，作者建议这样做：

<form method="post" action="<?!= ScriptApp.getService().getUrl() ?>">
<input type="submit" value="submit">
</form>

但是复制和粘贴对我没有任何帮助，我不知道如何以其他方式实现它。看起来一般...

Answer 1

在尝试避免将页面重新加载到空白页面时，我遇到了同样的问题。对我有用的解决方案是Google Apps脚本文档中的一段代码（我留下了链接here）

我希望该解决方案可以帮助您解决空白重新加载问题。

<script>
      // Prevent forms from submitting.
      function preventFormSubmit() {
        var forms = document.querySelectorAll('form');
        for (var i = 0; i < forms.length; i++) {
          forms[i].addEventListener('submit', function(event) {
            event.preventDefault();
          });
        }
      }
      window.addEventListener('load', preventFormSubmit);

</script>

Google Apps脚本：提交表单+保留窗口内容+让浏览器提供要价来保存名称/密码

1 个答案: