运行 像异步一样一个接一个地运行,但没有异步

run functions one by one after each other like async but without async

其中一个将连接到 php 页面并获取一些数据,我的另一个函数将使用第一个函数收集的新数据更改一些 html 代码。

例如这是我的代码:

var $data;
firstFunction(){
    $.post("index.php",{},function(data){$data=data;});
}
secondFunction(){
    $("body").empty().append($data);
}
firstFunction();
secondFunction();

所以在上面的代码中,如果我们 运行 这将开始收集数据,但在完成收集数据之前,它会 运行 第二个函数,这是不正确的,它必须 运行第一个函数完成后的第二个函数是这样的:

$.when(firstFunction()).done(function(){secondFunction();});

但它也不起作用,我知道有一种叫做异步的东西,但我想知道还有没有其他方法可以在不改变功能的情况下做到这一点,如果可能的话,请给我一个异步的例子。

而且我不想更改功能我的意思是我知道我可以这样做 :

var $data;
firstFunction(){
    $.post("index.php",{},function(data){$data=data;secondFunction();});
}
secondFunction(){
    $("body").empty().append($data);
}
firstFunction();

正如您在新代码中看到的那样,第二个函数将 运行 在第一次许可后完成它的工作,但我不能也不想这样做我想要类似异步的东西但在其他如果可能的话,因为我有很多功能,而且更改主题需要很长时间。

非常感谢。

尝试在脚本标签中使用 async 属性:

<script src="demo_async.js" async></script>

来源:https://www.w3schools.com/tags/att_script_async.asp

您可能需要考虑使用像 Axios 这样基于承诺的库,您可以将 async/await 与此方法以及承诺链接一起使用。您可以使用带有 CDN 的脚本标签或通过 NPM/Yarn.

将其引入您的应用程序

https://github.com/axios/axios

这是一个异步等待的例子:

async function getData(){

 async function getPosts(){
  try {
   const response = await 
   axios.get('https://jsonplaceholder.typicode.com/posts/1');
    return response
   } catch (error) {
    console.error(error);
   }
 }

 var Posts = await getPosts();
 document.getElementById('posts').textContent = JSON.stringify(Posts.data);

 async function getComments(){
  try {
   const response = await 
   axios.get('https://jsonplaceholder.typicode.com/comments/1');
    return response
   } catch (error) {
   console.error(error);
   } 
 }


  var Comments = await getComments();
  document.getElementById('comments').textContent = 
  JSON.stringify(Comments.data);

}

https://jsfiddle.net/Lm2c6r40/