Question

我正在使用asynch xmlhttprequests从我在这里制作的Chrome扩展程序中获取来自API的API的数据

function getInfo(url, callback) {
    var xmlhttp;
    xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState === 4 && xmlhttp.status === 200) 
            callback(xmlhttp.responseText);
    }
    xmlhttp.open("GET", url, true);
    xmlhttp.send();
}

我有一些标签，点击后我希望他们像这样制作xmlhttprequest请求

<div class="tab">
        <button class="tablinks" id = "HN" onclick="getLinks(event)"><img src=https://upload.wikimedia.org/wikipedia/commons/thumb/d/d5/Y_Combinator_Logo_400.gif/100px-Y_Combinator_Logo_400.gif></button>
        <button class="tablinks" id= "Reddit" onclick="getLinks(event)"><img class = "logo" src=https://www.observepoint.com/wp-content/uploads/2015/03/reddit-129.png></button>
        <button class="tablinks" id= "Github" onclick="getLinks(event)"><img class ="logo" src=https://static1.squarespace.com/static/56278c08e4b07be93cfbb3aa/t/57f1de373e00bef6ad3fc3bc/1475468903021/github-logo?format=100w></button>
    </div>

function getLinks(evt) {
    getInfo("https://hacker-news.firebaseio.com/v0/topstories.json", function(result) {
        //do stuff
  });  
}

当我调用getLinks函数时，我所做的改变HTML的东西永远不会改变。我的问题是，是否有可能将回调函数放在另一个函数中，就像我正在做的那样？或者我是以错误的方式接近它？我想要它，这样只有当我按下三个按钮之一时，它才会从API中检索链接并将它们放入HTML中。是否有一种更好的方法可以在vanilla中调用异步调用JS只在特定操作期间发生。我是JS的新手。

Answer 1

我的问题是，是否可以将回调函数放在另一个函数中，就像我正在做的那样？

是

我可以在另一个函数中包装asynch xmlhttprequest的回调函数吗？

1 个答案: