Javascript 弹出式html页面会延迟重新加载父页面_Javascript_Html_Popup

Javascript 弹出式html页面会延迟重新加载父页面

javascript html

Javascript 弹出式html页面会延迟重新加载父页面,javascript,html,popup,Javascript,Html,Popup,我在Javascript中重新加载父页面时遇到问题当我打开带有表单的弹出窗口并提交它（第一次尝试）时，父页面会重新加载，但会使用旧数据当我使用另一个值（第二次尝试）再次执行此操作时，父页面确实显示了数据中的更改，但它显示了第一次尝试之前的sumbit值当我第三次尝试并提交第三个值时，父页面将重新加载并显示第二个值等等，等等。这就是滞后更重要的是，这只适用于Chrome（Mac）。在Safari和Firefox中，表单甚至没有提交。无论我提交弹出式表单多少次，数据都保持不变发生了什么，

我在Javascript中重新加载父页面时遇到问题

当我打开带有表单的弹出窗口并提交它（第一次尝试）时，父页面会重新加载，但会使用旧数据

当我使用另一个值（第二次尝试）再次执行此操作时，父页面确实显示了数据中的更改，但它显示了第一次尝试之前的sumbit值

当我第三次尝试并提交第三个值时，父页面将重新加载并显示第二个值

等等，等等。这就是滞后

更重要的是，这只适用于Chrome（Mac）。在Safari和Firefox中，表单甚至没有提交。无论我提交弹出式表单多少次，数据都保持不变

发生了什么，如何修复

指向弹出窗口的链接：

以及弹出窗口本身：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

<script>
    function dothesubmit(){
        paymentform=document.getElementById('addpayment');
        paymentform.submit();
        window.opener.location.href="http://localhost:5000/editsupplement/10";
        window.close();
}
</script>    

<form id="addpayment" action="/add-payment/16" method="post">
    <input type="text" class="form-control" name="sum">
    <button type="submit" onclick="dothesubmit();">Save</button>
</form>      

</body>
</html>


函数dothesubmit（）{
paymentform=document.getElementById（'addpayment'）；
paymentform.submit（）；
window.opener.location.href=”http://localhost:5000/editsupplement/10";
window.close（）；
}
拯救

您太快地重新加载了父页面。您应该先等待表单提交完成，然后再重新加载父页面。您可以通过ajax提交表单，等待请求完成，然后重新加载父页面并关闭弹出窗口

$('#addpayment').submit(function(e) {
    e.preventDefault();
    return $.ajax({
      type: "POST",
      url: this.getAttribute('action'),
      data: $(this).serialize(),
      dataType: 'json'
    }).always(function(data){
        window.opener.location.href="http://localhost:5000/editsupplement/10";
        window.close();
    });
})

这是一把小提琴：