未执行 $.when() 后 .done(function()) 中的 Jquery ajax 代码

Question

这是问题所在的 jquery 代码。我想让 ajax 将 json 数据发送到服务器，然后提交表单。如果我没有 when 和 done 子句，那么提交可能在 ajax 之前完成，并且无法及时检索成功或错误。

 function deleteImage(button)
    {
        //There is only one image that is a sibling of the delete button
        var image = $(button).siblings(".MultiFile-image")[0];
        var groupId = $(image).data("modelId");
        var imgId = $(image).data("id");
        var imgSrc = $(image).attr("src");

    //Delete the image view after the removed button is clicked but the data to be sent to the server for deletion is already stored
    $(button).parent(".MultiFile-label").remove();


    var imageToDelete = {imgId:imgId, imgSrc:imgSrc, groupId:groupId};
    var imageJSON =  '{"imageToDelete":' + JSON.stringify(imageToDelete) + "}";
    //This is needed to check whether ajax has been executed before submission
    var sentImageData = false;
    $("form").submit(function(e) {
        //Stop submission, need to send data through ajax first, will submit after ajax is executed later.
        if(!sentImageData)
        {
            e.preventDefault();
    //Send the images for deletion only when the form has been submitted
    //For some reason this code is never executed and go immediately to the end of this method

 $.when(sendImageData(imageJSON)).done(function(jqXHR) {
                if(jqXHR.readyState == 4 && jqXHR.status == 200)
                {
                    sentImageData = true;
                    $("form").submit();
                }
                else
                {
                    console.log(jqXHR);
                    sentImageData = false;
                }
            }); //For some reason the debugger skips to here and return is undefined

            }
            //If executed is true, send the form as normal
        });
}
/**
 * @var imageJSON the image json data that will be sent to the server to delete the image
 * @returns {@exp;$@call;ajax} return XMLHttpRequest of the ajax
 */
function sendImageData(imageJSON)
{
   return $.ajax({
            type: 'POST',
            data: imageJSON,
            dataType: 'JSON',
            url: "index.php?r=artworkGroup/deleteArtwork",
        });
}

谢谢你，非常感谢社区在这个问题上的帮助:)

编辑： 这是处理此 ajax 代码的操作。 json 的一个例子是："{"imageToDelete":{"imgId":2,"imgSrc":"upload_file/artwork/1-New_Artwork_Group/12861274.jpg","groupId":2}}"

  public function actionDeleteArtwork() {
            $noError = false;           
            if(isset($_POST["imageToDelete"]))
            {
                $imageArray = $_POST["imageToDelete"];
                //Delete every image retrieved by post
                foreach($imageArray as $image)
                {
                    $transaction = Yii::app()->db->beginTransaction();
                    try{
                        $imageToDelete = json_decode($image);
                        $model = $this->loadModel($imageToDelete->groupId);
                        $artworkToDelete = $model->artworks->loadModel($imageToDelete->id);
                        if($imageToDelete->imgSrc == $artworkToDelete->imgSrc)
                        {
                            $artworkToDelete->delete();                    
                            if(file_exists($imageToDelete->imgSrc))
                            {
                                unlink($imgToDelete->imgSrc);
                            }
                        }    
                        else
                        {
                            $hasError = true;
                        }   
                        $transaction->commit();
                    }
                    catch(Exception $e)
                    {
                        $transaction->rollback();
                        $hasError = true;
                    }
                    //Delete the image files if there are no errors and that the file exists, otherwise just ignore 
                    if(file_exists($imageToDelete->imgSrc) && $noError)
                    {
                        unlink($imageToDelete->imgSrc);
                    }
                }
            }
       }

Answer 1

您在 ajax 请求中省略了 url。这意味着它将访问您当前的页面网址。这可能会触发超时。

和 Timeout 是 $.ajax 中的一种错误。这就是为什么你的

sendImageData(imageJSON)

返回你的错误。因此，您的 .done() 没有被执行。