Question

我有一张表格

<form name="thumbnail" action="<?php echo $_SERVER["PHP_SELF"];?>" method="post">
    <input type="hidden" name="x1" value="" id="x1" />
    <input type="hidden" name="y1" value="" id="y1" />
    <input type="hidden" name="x2" value="" id="x2" />
    <input type="hidden" name="y2" value="" id="y2" />
    <input type="hidden" name="w" value="" id="w" />
    <input type="hidden" name="h" value="" id="h" />
    <input type="submit" name="upload_thumbnail" value="Save Image" id="save_thumb"/>
    <?php $_SESSION['image1'] = $thumb_image_name.$_SESSION['user_file_ext'];?>
</form>

我希望在完成此功能后关闭此表单

$(document).ready(function () { 

    $('#save_thumb').click(function() {
        var x1 = $('#x1').val();
        var y1 = $('#y1').val();
        var x2 = $('#x2').val();
        var y2 = $('#y2').val();
        var w = $('#w').val();
        var h = $('#h').val();
        if(x1=="" || y1=="" || x2=="" || y2=="" || w=="" || h==""){
            alert("Please Select Area to Crop");
        }else{

        return true;
        }
    });


});

问题是如果我把window.close（）;在返回true之前; 窗口关闭，但窗体不提交，如果我把它放回真后;然后窗口不会关闭。

这不起作用

$("thumbnail").submit(function() {
    $.post($(this).attr('action'), $(this).serializeArray());
    window.close();
});

这也行不通：

function closeSelf(){
       document.forms['thumbnail'].submit();
       window.close();
}

<input type="submit" name="upload_thumbnail" value="Save Image" id="save_thumb" onclick="closeSelf();"/>

Answer 1

ajax表单提交可能会帮助您。点击即可提交表格，并在完成ajax请求后关闭窗口。像这样的东西

$(document).ready(function () {
   $('[name="thumbnail"]').submit(function() {
        <Perform your validation here>
         $.ajax({
              url: $('[name="thumbnail"]').attr('action'),
              method: 'post',
              data: $('[name="thumbnail"]').serialize(),
              success: function (data, status) {
                 window.close();
               }

         }
    }
}

Answer 2

试试这个：

$('[name="thumbnail"]').submit(function() {
 var x1 = $('#x1').val();
    var y1 = $('#y1').val();
    var x2 = $('#x2').val();
    var y2 = $('#y2').val();
    var w = $('#w').val();
    var h = $('#h').val();
    if(x1=="" || y1=="" || x2=="" || y2=="" || w=="" || h==""){
        alert("Please Select Area to Crop");
    }else{
       $.post($(this).attr('action'), $(this).serializeArray());
       window.close();
    }
});

提交表格后关闭窗口

2 个答案: