2013-10-25 3 views
0

У меня есть функция, которая принимает строку и выводит ее по одному символу за раз с задержкой. Событие происходит, когда пользователь нажимает ссылку или кнопку. Проблема в том, что если пользователь нажимает на ссылку, а затем на другую до того, как будет выполнен первый, они оба будут запускаться одновременно и выводятся на экран. Он перепутался. ex: string1: «Мне очень нравится пирог» string1: «так и следующий парень» Выход: i sloi kdeo epse .... и так далее.вызов одной и той же функции несколько раз при нажатии

Кто-нибудь знает способ исправить это? Я думаю, мне нужен способ проверить, обрабатывается ли функция уже, а затем дождаться, пока она не будет выполнена до начала следующего.

ответ

1

Поместите обе функции внутри объекта (т.к. глобалы плохо), добавьте переменную в объект, который знает, если функция выполняется, и проверить эту переменную, например:

var ns = { 
    isExecuting:false, 
    func1: function(){ 
     if (this.isExecuting) { return; } 
     this.isExecuting = true; 
     //do stuff 1 
     this.isExecuting = false;   
    }, 
    func2: function(){ 
     if (this.isExecuting) { return; } 
     this.isExecuting = true; 
     //do stuff 2 
     this.isExecuting = false;   
    } 
} 

и дополнительной элегантности:

var ns = { 
    isExecuting:false, 
    executeConditionally:function(action){ 
     if (this.isExecuting) { return; } 
     this.isExecuting = true; 
     action(); 
     this.isExecuting = false; 
    } 
    func1: function(){ 
     this.executeConditionally(function(){ 
      //stuff 
     })  
    }, 
    func2: function(){ 
     this.executeConditionally(function(){ 
      //stuff 
     }) 
    } 
} 
+0

Приобретено хорошее объяснение использования крышки, чтобы избежать загрязнения вашей страницы. – NibblyPig

+0

спасибо, я попробовал более простую версию и, похоже, не работает с рекурсивной функцией, но неплохо начал работать над методом. – user2376313

+0

Хорошо, мне пришлось установить для переменной isRunning значение false перед каждым вызовом рекурсии. он работает сейчас, но я думал больше о том, как отложить второй вывод строки, а не запускать его вообще. все остальное, которое запускается, когда на ссылку щелкнули все еще функции при нажатии. Я, вероятно, перекодирую его позже, чтобы остановить функцию задержки и сразу же вывести то, что осталось от строки, когда пользователь снова нажимает. Спасибо всем за помощь, хотя – user2376313

0

добавить переменную глобально или в рамках вне метода, называемого IsProcessing и установить его на истинный первый раз, когда метод вызывается, по методу вы можете просто проверить if (IsProcessing) return false;

0

Все, что вам нужно сделать, это установить переменную, которая указывает, работает ли функция:

var isRunning = false; 

$('a').click(function({ 
    if(isRunning == false){ 
     isRunning = true; 
     ///Do stuff 
     isRunning = false; 
    } 
    else{ 
     return false; 
    } 
}); 
0

Вы не хотите, чтобы все клики, которые необходимо принять во внимание, но в порядке? Если да, то я предлагаю вам отдельные потоки между добавлением щелчок к процессу, и потребляя Клики :

в HTML:

<a class="example" href="javascript:void(0)" onclick="delayPushLine();">i like pie very much</a><br/> 
<a class="example" href="javascript:void(0)" onclick="delayPushLine();">so does the next guy</a> 
<div class="writeThere"></div> 

и JavaScript (с помощью JQuery немного)

var charDisplayDelay = 50; // the time between each char display 
var displayDelay = 2000; // the time before a click is handled 
var lines = []; 
var lineIdx = 0, pos = 0; 

function delayPushLine(e) { 
    if (!e) { 
     e = window.event 
    } 
    setTimeout(function() { lines.push(e.srcElement.innerText); }, displayDelay); 
} 

function showLines() { 
    if (lines.length > lineIdx) { 
     if (pos < lines[lineIdx].length) { 
      $(".writeThere").append(lines[lineIdx].substr(pos,1)); 
      pos++; 
     } else { 
      pos = 0; 
      lineIdx++; 
      $(".writeThere").append("<br/>"); 
     } 
    } 
} 

setInterval("showLines()", charDisplayDelay); 

http://jsfiddle.net/kD4JL/1/

Смежные вопросы