jQuery onClick исполнение


1

У меня есть этот бит javascript, написанный с помощью jQuery 1.2.5. Он содержится внутри основной функции() плагина, который я написал. Плагин - горизонтальный скроллер галереи, очень похожий на jCarousel. Он много использует автоматическое вычисление ширины и определяет, сколько прокручивается на основе этого и размера изображений, что и происходит во всех вычислениях.

В чем мой вопрос: как я могу предотвратить его отключение до того, как закончится предыдущее выполнение. Например, если я получаю небольшой щелчок счастливым и просто отчаянно затираю на .digi_next. В этом случае все происходит не так хорошо, когда это происходит, и я хотел бы это исправить :) Я думал, что ответ может заключаться в queue, но все мои попытки использовать его ничего не оправдали.

var self = this; 
    $(".digi_next", this.container).click(function(){ 

     var curLeft = $(".digi_container", self.container).css("left").split("px")[0]; 
     var newLeft = (curLeft*1) - (self.containerPad + self.containerWidth) * self.show_photos; 

     if (newLeft < ((self.digi_gal_width - (self.containerPad + self.containerWidth) * self.show_photos)) * -1) { 
      newLeft = ((self.digi_gal_width - (self.containerPad + self.containerWidth) * self.show_photos)) * -1; 
     } 

     $(".digi_container", self.container).animate({ 
      left: newLeft + "px" 
     }, self.rotateSpeed); 
    }); 

Спасибо!

  0

сторона примечание : Я очень рекомендую jQuery v1.2.6, так как релиз для 1.2.5 был искажен, а 1.2.6 имеет важные исправления ошибок. 23 сен. 082008-09-23 18:53:32

  0

Я рассмотрю его, спасибо. Я просто использовал 1.2.5, потому что он в нашем решении и на самом деле не имеет возможности изменить его, но я знаю, кто делает ...>.> 23 сен. 082008-09-23 19:00:55

10

Просто используйте глобальный флаг занятости. Когда вы вводите обработчик кликов, проверьте его и действуйте только в том случае, если оно ложно. Сразу установите значение true, а затем верните значение false, когда анимация закончится. JavaScript является однопоточным, поэтому нет никаких условий для соревнований.

var busy = false; 
$("...").onclick(function() { 
    if (busy) return false; 
    busy = true; 
    $("...").animate(..., ..., ..., function() { 
     busy= false; 
    }); 
    return false; 
}); 

1

Поскольку вызовы функций JavaScript являются асинхронными, вы можете передать в качестве параметра функцию обратного вызова, которая вызывается, когда предыдущий вызов заканчивается (тот же для ошибок).

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

Надеюсь, это поможет.

С уважением


5

Посмотрите на jQuery UI. В частности, the effects-part подключаемого модуля. Я использую слайд-эффект на my personal website (щелкните по стрелкам по бокам ящиков).

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

Here's the source-code


2

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

$("...").onclick(function(el) { 
    var self = el; 
    if (self.busy) return false; 
    self.busy = true; 
    $("...").animate(..., ..., ..., function() { 
     self.busy= false; 
    }); 
    return false; 
});