Question

我已经搜索过堆栈这样的问题并且找不到明确的答案。我有一个小提琴，用一个字母的字母输入。但是当我运行两次函数时，它会一起完成。我尝试使用的时候然后它仍然似乎不起作用。我希望结果是“Hello，World！Hello2”，而是将它打印在一起，“HHeelllloo ....”

http://jsfiddle.net/Jsbbvk/vL8tLwfh/

（一些伪代码）

$.when(showText(param1, param2)).then(function() {
  showText(param3, param4);
});

Answer 1

我试着解释它为什么会发生：

首先$ .when（showText（params））调用然后追加第一个索引（＆＃34; H＆＃34;）到＆＃34; div＆＃34;
然后使用interval调用setTimeout的函数，showText是再次打电话
但你的$ .when（showText（params））不要等到setTimeout 完成后，
所以，$ then方法调用并运行你的showText（＆＃34;＃msg＆＃34;，＆＃34; Hello2＆＃34;，0， 500）showText（＆＃34;＃msg＆＃34;，＆＃34; Hello，World！＆＃34;，0,500）仍在运行印刷后＆＃34; H＆＃34;
所以他们两个都在同一时间运行，而不是彼此等待

我尝试修复你的代码，而不是使用$ .when和$ .the，我正在使用回调函数。因此，在setInterval完成作业之前，回调不会调用。

＆＃13;

function showText (target, message, index, interval, callback) {
  if (index < message.length) { 
    $(target).append(message[index++]); 
    var session = setTimeout(function () {
    	showText(target, message, index, interval, callback);
      if(index === message.length -1){
      	callback ? callback() : null;
      }
    }, interval); 
  }
}
    
$(function () { 

    showText("#msg", "Hello, World!", 0, 500, function(){
    	showText("#msg", "Hello2", 0, 500)
    })
    
 
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<div id="msg"/> 
<span id="text_target"></span>

＆＃13;

我的小提琴： https://jsfiddle.net/firhatsungkar/zg9un4po/

javascript如何使用'when'和'then'运行函数

1 个答案: