ajax 调用上传图像正在冻结浏览器 [英] ajax call to upload image is freezing the browser

问题描述

这是我用来使用 AJAX 将图像上传到服务器的代码，但由于某种原因浏览器冻结，直到图像被上传.请有人告诉我问题背后的原因是什么并帮助我解决它.

This is code i am using to upload image to server using AJAX but for some reason the browser freezes till the image is uploaded. please someone tell me what's the reason behind then problem and help me solve it.

$(function() {
    $("#form4").on('submit', function() {
        if($("#file").val()=== ""){
            alert("please select the image to upload");
            return false;
        }
        var formData = new FormData($(this)[0]);
        $.ajax({
            url: 'ajaxify/uploadphoto.php',
            async:true,
            type: 'POST',
            data: formData,
            beforeSend: function() {
                $(".note").show().html("uploading....");
            },
            success: function(data) {
                $(".note").html("uploaded successfully").fadeOut(2000);
                $('.galleryData').load('ajaxify/getphotos.php');
            },
            cache: false,
            contentType: false,
            processData: false
        });
        return false;
    });
});

这是html:

<form id="form4" action="ajaxify/uploadphoto.php" method="post" enctype='multipart/form-data'>
    <h2>upload album</h2>
    <label>select the file to upload</label>
    <input type="file" id="file" name="file[]" multiple="multiple" /><br/>
    <input type="submit" value="Upload"/>
    <div class="note"></div>
</form>

推荐答案

由于 async 设置为 false，您将冻结 UI 线程，直到上传完成.

Since async is set to false, you are freezing the UI thread until the upload is complete.

尝试将其更改为 true.

您可以在 API 中阅读属性.

You can read about the property in the API.

这篇关于ajax 调用上传图像正在冻结浏览器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！