弹出html页面重新加载滞后的父页面

我有重新加载在Javascript中的父页面的问题。弹出html页面重新加载滞后的父页面

当我用窗体打开弹出窗口并提交它（第一次尝试）时，父页面会重新载入，但会与旧数据一起重新载入。

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

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

依此类推，等等。所以有这个滞后。

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

发生了什么事以及如何解决？

的链接弹出窗口：

<a href="#" onclick="window.open('/add-payment/16','popUpWindow','height=500,width=400,left=100,top=100,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes');">550</a>

，并在弹出的窗口本身：

<!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>

来源

2014-11-23 kurtgn

你太很快重载父页面。在重新加载父页面之前，您应等待表单提交完成。您可以通过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(); 
    }); 
})

这里是一个小提琴：http://jsfiddle.net/tyb2gy2d/3/

来源

2014-11-23 13:21:33 ArtBIT

哦，谢谢！没有想过。 – kurtgn 2014-11-24 17:08:31

弹出html页面重新加载滞后的父页面

回答

相关问题