如何控制多函数调用递归函数时不抢进程?

Question

function aaa() {  document.getElementById("div1").style.left = document.getElementById("div1").style.left - 1
  if(document.getElementById("div1").style.left  >= 0){
    setTimeout("aaa()", 20);
  }

显然aaa()函数是用来移动一个div的函数bbb()有权调用aaa()
函数ccc()有权调用aaa()
函数ddd()有权调用aaa()
如何做到让bbb()调用aaa()的时候  ccc()和ddd()无权调用?  等aaa()递归达到目的后 再放开权限?
因为现在3个按钮分别控制bbb()ccc()ddd()
所以 3个按钮同时按下的时候  aaa()函数就会以原来3倍的速度调用...影响了原来的div的缓慢移动效果

Answer 1

会的...
你不信试一试原来DIV移动速度很慢 
3个按钮都点下去  DIV飞了一样...

Answer 2

var a = true;
function aaa() {
  if(!a) return;
  a = false;
  document.getElementById("div1").style.left = document.getElementById("div1").style.left - 1
  if(document.getElementById("div1").style.left  >= 0){
    setTimeout("aaa()", 20);
  a = true;
  }但是我觉得同样没有意义

Answer 3

在调用aaa()
的外面套一层控制还有楼主记得Javascript只有一个线程setTimeout功能并不是多线程 是模拟出来的

Answer 4

cj205的方式不行啊，在aaa()第一次调用他本身的时候 就调用不了了...

Answer 5

当bbb()调用了aaa()后   所有bbb(),ccc(),ddd()函数都无法调用aaa()直到aaa()递归到调用自己结束，才恢复其他3个函数的功能我想达到的就是上述效果

Answer 6

哦 那个改成return false

Answer 7

var a = true;
function aaa() {
  if(!a) return false;
  a = false;
  document.getElementById("div1").style.left = document.getElementById("div1").style.left - 1
  if(document.getElementById("div1").style.left >= 0){
  setTimeout("aaa()", 20);
  a = true;
  }
这样写实肯定不行的

Answer 8

因为你本身有20ms的等待时间
现假设有A B C 三个方法在调用aaa()
那么A调用了aaa()
aaa()运行了之后休息20ms
B调用aaa()
在A的20ms里B是可以运行的
同理C也是
所以原本20ms内只运行一次的现在可以变为3次至于说setTimeout其实是模拟多线程的，但是不影响这个结果的诞生。

Answer 9

问题解决了  设置2个变量才行var flag = true;
function process(){
   if (flag) {
flag = false;
var lock = flag;
aaa(lock);
}
}function aaa() {
  flag = lock;
 document.getElementById("div1").style.left = document.getElementById("div1").style.left - 1
  
  if(document.getElementById("div1").style.left  >= 0){
    setTimeout("aaa()", 20);
  }else{
    flag = true;
  }
}
一个是局部变量  一个是全局变量

Answer 10

function aaa(lock) {
   flag = lock;
   document.getElementById("div1").style.left = document.getElementById("div1").style.left - 1
   
   if(document.getElementById("div1").style.left >= 0){
       setTimeout("aaa(" + lock + ")" , 20);
   }else{
       flag = true;
   }
}
上面的aaa（）函数写错了 纠正一下

Answer 11

昨天回家整理了一下   其实这个问题有两种解决方式。
方式1:通过套控制函数解决
var flag = true;
function process(){
   if (flag) {
       flag = false;
       aaa();
   }
}
function aaa() {
    document.getElementById("div1").style.left = document.getElementById("div1").style.left - 1
    
    if(document.getElementById("div1").style.left >= 0){
         setTimeout("aaa()" , 20);
    }else{
         flag = true;
    }
}
这样，外部套用process()即可
-------------------------------------------------------------------------
方式2:通过传参var process = true;
function aaa(lock) {
    if(process||lock){
        process = false;
        document.getElementById("div1").style.left = document.getElementById("div1").style.left - 1
    
        if(document.getElementById("div1").style.left >= 0){
             setTimeout("aaa(true)" , 20);
        }else{
             process= true;
        }
    }
}这样写，aaa（true）就永远可以调用自己
而bbb()等函数调用aaa(false)的时候就只有1个能调，其他就调用不了了，直到aaa（）进程做完才能解锁process，才能重新被bbb(),cccc(),ddd()等函数调用