表单提交后JavaScript函数未运行

Question

我尝试将表单数据提交到新选项卡中的“https://wallpapersforandroid.com/wallpaper-4/”，并在提交后将父页面重定向到"https://www.youtube.com“。我成功地在新选项卡中打开了操作页面，但父页面没有重定向我使用的代码：

<form action="https://wallpapersforandroid.com/wallpaper-4/" method="post" target="_blank">
Type Password From Below Image: <input name="pass" type="text" />
<input id="myForm" type="submit" /><br />
<script>
  document.getElementById("myForm").onsubmit = function() {
    window.location.href = "https://www.youtube.com";    
  };
</script>

Answer 1

如果提交表单，当前页面将被拆卸并替换为提交表单的结果。如果设置了新位置，则当前页面将被拆卸并替换为该位置的页面。你不能同时做这两件事；他们中的一个赢了，另一个会输。

您可以通过ajax提交表单，然后执行重定向：

document.getElemntById("myForm").addEventListener("submit", function(e) {
    // Prevent the default form submission
    e.preventDefault();

    // Get the form data
    const data = new FormData(this);

    // Do the ajax
    fetch(this.action, {
        method: this.method,
        body: data
    })
    .then(response => {
        if (!response.ok) {
            throw new Error("HTTP error " + response.status);
        }
        window.location.href = "https://www.youtube.com";
    })
    .catch(error => {
        // ...handle/report error...
    });
});