Question

我使用弹出窗口填写表单并将数据提交给MySQL。如果我在提交数据后手动关闭弹出窗口，它可以正常工作。但是，如果我使用＆＃34; onsubmit＆＃34;关闭窗口触发＆＃34; window.close＆＃34;，窗口立即关闭，但很多时候数据都没有保存。我想即使在数据发送到服务器之前窗口关闭得太快了。我试图通过使用setTimeout函数来延迟关闭窗口。我不能让它工作，我的意思是关闭弹出窗口的延迟。

这是父窗口代码：

<input type="submit" value="my phsical template" onclick="popupUploadForm()"/> 

<script type="text/javascript"> 
function popupUploadForm(){
    var newWindow = window.open('physical.php');
} 
</script>

弹出窗口代码。按下＆＃34; save＆＃34;后窗口关闭。但大部分时间，数据都没有保存。

  <form  method="post" action="physical.php" onsubmit="closeSelf()">
  <textarea name="text" id="textarea" cols="45" rows="10"></textarea>
  <div><input type="submit" value="Save"/></div>

<script type="text/javascript">
 function closeSelf(){
     self.close();
  };   
 </script>

尝试延迟关闭窗口。它没有用。

 function closeSelf(){
 setTimeout(function(){
self.close();
},1000);  };

Answer 1

只需停用提交按钮，等待服务器响应，然后使用承诺关闭您的模式：{{3}}

<div id="modal">
    <form id="myform" class="ui form">
        <div class="field">
            <label>Username</label>
            <input type="text"/>
        </div>
        <div class="field">
            <label>Password</label>
            <input type="password"/>
        </div>
        <button class="ui primary button">Save</button>
    </form>
</div>

的javascript

$('#myform').submit(function(e) {
    // Prevent normal submit to server, use JavaScript instead
    e.preventDefault(); 

    // Check if save already in progress
    if ($('#myform .primary').hasClass('disabled')) {
        return;
    }

    $('#myform .primary').addClass('disabled');

    // Send form data to server...
    var promise = $.ajax({
        url: 'https://api.github.com/repos/laravel/laravel/issues?state=closed',
        method: 'GET'
    });

    // Ran after success
    promise.done(function() {
        console.log('closing modal... TODO');
    });

    promise.fail(function() {
        console.log('failed... something went wrong');
    });

    // Regardless of fail or success
    promise.always(function() {
        $('#myform .primary').removeClass('disabled');
    });
});

提交表单后如何延迟关闭弹出窗口？

1 个答案: