Javascript 如何使用OOP使异步ajax请求在完成时返回值？_Javascript_Ajax_Oop_Return

Javascript 如何使用OOP使异步ajax请求在完成时返回值？

javascript ajax oop

Javascript 如何使用OOP使异步ajax请求在完成时返回值？,javascript,ajax,oop,return,Javascript,Ajax,Oop,Return,请帮我输入下面的代码我希望对象“airported”返回机场列表，但目前我无法让它在每个循环完成在list.html中查找“li”的迭代后返回数据（通过ajax接收） airported对象正在使用Airport类的实例化。我不希望在我的应用程序的任何其他地方有任何复杂的代码。我只想调用“airport.list（）”并获取机场列表 html仅供参考。你不必研究它。我还必须使用它，我不能有一个漂亮的JSON或类似的东西 Javascript function Airport() {

请帮我输入下面的代码

我希望对象“airported”返回机场列表，但目前我无法让它在每个循环完成在list.html中查找“li”的迭代后返回数据（通过ajax接收）

airported对象正在使用Airport类的实例化。我不希望在我的应用程序的任何其他地方有任何复杂的代码。我只想调用“airport.list（）”并获取机场列表

html仅供参考。你不必研究它。我还必须使用它，我不能有一个漂亮的JSON或类似的东西

Javascript

   function Airport() {

        this.list = function() {

            var airportList = []

            var promise = this.data();

            promise.success(function(data){

                var list = data;

                var listSize = $(data).find('li').size();

                $.each($(list).find("li"), function(key,val) {

                    airportList.push(val);

                    if(listSize == key+1) {

                        console.log(airportList);

                        return false;

                    }

                });

            })

            return airportList;

        };

        this.data = function() {

            return $.ajax({
                url: "/list.html"
            })

        };

    }

    var airported = new Airport();

    console.log('airported', airported.list());

list.html

<html>
<head></head>
<body>
<div id="listautocomp" style="background:white">
    <ul id="ulSuggest">
        <li style="padding:0px;">
            <div id="WAS|0|0***&lt;b&gt;WAS&lt;/b&gt; - &lt;b&gt;Was&lt;/b&gt;hington All Airports, District of Columbia, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:hidden;;"></span><b>WAS</b>
                - <b>Was</b>hington All Airports, District of Columbia, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="SEA|1|0***SEA - Seattle/Tacoma, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>SEA
                - Seattle/Tacoma, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="SEA|0|0***SEA - Seattle All Airports, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:hidden;;"></span>SEA
                - Seattle All Airports, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="IAD|1|0***IAD - &lt;b&gt;Was&lt;/b&gt;hington Dulles, District of Columbia, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>IAD
                - <b>Was</b>hington Dulles, District of Columbia, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="DCA|1|0***DCA - &lt;b&gt;Was&lt;/b&gt;hington National, District of Columbia, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>DCA
                - <b>Was</b>hington National, District of Columbia, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="GEG|1|0***GEG - Spokane, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>GEG
                - Spokane, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="GEG|0|0***GEG - Spokane All Airports, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:hidden;;"></span>GEG
                - Spokane All Airports, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="PSC|1|0***PSC - Pasco, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>PSC
                - Pasco, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="BLI|1|0***BLI - Bellingham, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>BLI
                - Bellingham, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="YKM|1|0***YKM - Yakima Air Terminal, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>YKM
                - Yakima Air Terminal, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="YKM|0|0***YKM - Yakima All Airports, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:hidden;;"></span>YKM
                - Yakima All Airports, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="LKE|0|0***LKE - Seattle LKE Union, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:hidden;;"></span>LKE
                - Seattle LKE Union, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="EAT|1|0***EAT - Wenatchee, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>EAT
                - Wenatchee, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="PUW|1|0***PUW - Pullman, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>PUW
                - Pullman, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="ALW|1|0***ALW - Walla Walla, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>ALW
                - Walla Walla, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="MWH|1|0***MWH - Moses Lake, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>MWH
                - Moses Lake, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="MWH|0|0***MWH - Moses Lake All Airports, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:hidden;;"></span>MWH
                - Moses Lake All Airports, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="CLM|1|0***CLM - Port Angeles, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>CLM
                - Port Angeles, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="OLM|1|0***OLM - Olympia, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>OLM
                - Olympia, <b>Was</b>hington, United States
            </div>
        </li>
        <li style="padding:0px;">
            <div id="PAE|1|0***PAE - Everett, &lt;b&gt;Was&lt;/b&gt;hington, United States"
                 onclick="SetLocationStrings(this.id)" onmouseover="SuggestMouseOver(this)"><span class="airporticon"
                                                                                                  style="visibility:visible;;"></span>PAE
                - Everett, <b>Was</b>hington, United States
            </div>
        </li>
    </ul>
</div>
</body>
</html>




是
-华盛顿哥伦比亚特区所有机场，美国


大海
-西雅图/塔科马，华盛顿，美国


大海
-西雅图所有机场，华盛顿，美国


网络成瘾
-华盛顿杜勒斯，哥伦比亚特区，美国


DCA
-华盛顿国家，哥伦比亚特区，美国


GEG
-斯波坎，华盛顿，美国


GEG
-斯波坎所有机场，华盛顿，美国


PSC
-帕斯科，华盛顿，美国


BLI
-贝灵汉，华盛顿，美国


YKM
-亚基马机场，华盛顿，美国


YKM
-亚基马所有机场，华盛顿，美国


LKE
-西雅图LKE联盟，华盛顿，美国


吃
-Wenatchee，华盛顿，美国


呕吐
-普尔曼，华盛顿，美国


ALW
-瓦拉瓦拉，华盛顿，美国


兆瓦
-摩西湖，华盛顿，美国


兆瓦
-摩西湖所有机场，华盛顿，美国


CLM
-美国华盛顿州洛杉矶港


奥尔姆
-奥林匹亚，华盛顿，美国


PAE
-埃弗雷特，华盛顿，美国

好的，因为您在获取数据之前返回，所以promisse将无法同步工作。。。您需要传递回调以接收数据

本票是异步的，你可以像下面这样做

function Airport() {

    this.list = function(callback) {

        var airportList = []

        var promise = this.data();

        promise.success(function(data){

            var list = data;

            var listSize = $(data).find('li').size();

            $.each($(list).find("li"), function(key,val) {

                airportList.push(val);

                if(listSize == key+1) {

                    console.log(airportList);

                    return false;

                }

            });

            if( typeof callback === "function" ){


               callback(airportList); //the return is here really, but async

            }

        })

        //return airportList; the return is empty here.

    };

    this.data = function() {

        return $.ajax({
            url: "/list.html"
        })

    };

}

var airported = new Airport();

airported.list(function(airportList){
     console.log('airported', airportList);
});

你想要一个文本形式的机场列表吗？在JSON中？在HTML中？您想要什么格式？我想要返回airportList数组，它是在响应中找到的“li”元素数组。不管是文本、JSON还是HTML——这不是问题的范围。只需添加一点，每个循环中的console.log（airportList）都可以正常工作。这不是问题所在。我遇到的问题是，试图找出如何将其作为类外的对象返回。我回答说，问题是，promisse是异步的，当您调用返回列表时，还没有完成…的可能重复项