在调用ajax函数之前，等待复杂的函数完成具有多个ajax调用

编程问答 2022-07-27

问题描述

在这里，我会尽力清楚地解释这个问题。

从最简单的任务开始，我的第一个任务是调用此create（）函数，该函数内部包含2个Ajax调用

 popup().create('Zip code is required to add product to cart')

create: function (popupTitle) {
                let self = this;
                let options = {
                    type: 'popup',responsive: true,modalClass: 'zip-modal',title: popupTitle,buttons: [{
                        text: $.mage.__('Apply'),class: 'action primary',click: function () {
                            if (self.validateZip(self.zipForm)) {
                               ----------> self.getCatalog(); ------------<
                                this.closeModal()
                            }
                        }
                    }],closed: function () {
                        if (self.zipInput.val() === '') {
                            $.cookie('zip_code_set','not_set',{path: '/'})
                            self.lightBox.show();
                        }
                    }
                };
                modal(options,this.popup);
                this.popup.modal('openModal');
            
        },

第一个存在。指定的getCatalog（）函数

        getCatalog: function () {
            let self = this;
            let value = this.zipInput.val();

            fullScreenLoader.startLoader();

            storage.post(
                url.build('rest/V1/zip/getCatalog'),JSON.stringify({
                    zipCode: value
                }),true,'application/json'
            ).done(
                function (response) {
                    ---------> self.validateCatalog(); -----------<
                    fullScreenLoader.stopLoader();
                },)
        },

创建一个ajax发布请求，并且在它的.done（）函数中还有另一个函数，该函数执行另一个ajax获取请求

        validateCatalog: function () {
            fullScreenLoader.startLoader();

            storage.get(
                url.build('rest/V1/zip/getCategory'),).done(
                function (response) {
                    customerData.set('categoryMenu',response[0].categoryMenu);
                    fullScreenLoader.stopLoader();
                    // window.location.reload();
                },

所有这些基本上都是在create（）函数之后发生的，我必须调用另一个执行ajax请求的函数，但是它必须等到所有这些create（）函数完成然后才触发，这是我发现的方法$ .Deferred和回调函数，但我也无法使它起作用，在每次尝试中，它总是会先用ajax请求触发此函数，然后再用全部ajax完成create（）函数要求。任何帮助将不胜感激。

解决方法

作为评论可能会更好，但我没有足够的代表来发表评论。

也许有一种更有效的方法，但是我能想到的最简单的方法是使用一个布尔变量，该变量在最终ajax调用完成时会设置为true，并且只是用一个间隔来检查值...类似：> 

 <td>
        {{$applicant_details->resume  }}
       
            <iframe src="{{asset('resume/'.$applicant_details->resume) }}" width=”100%” height=”100%”>
                This browser does not support PDFs. Please download the PDF to view it: Download PDF
                </iframe>
            
                <embed  src="{{asset('resume/'.$applicant_details->resume) }}" type=”application/pdf” width=”100%” height=”100%”>
    </td>
ajaxdeferreddeferredjavascriptjquery