2016-04-24 19 views
0

は、ユーザーがフルでない入力にフォームを送信したときに、いくつかのシェイクエフェクトを追加しました。jQuery UI - Shakeエフェクトが複数回発生するのを防ぐ

しかし、ユーザーが送信ボタンで何度も押すと、シェイクエフェクトが何度も発生しました。

どのようにして1回以上の発砲を防ぐことができますか?

stop() - 動作しません。

clearQueue() - ページ内の最初の位置から移動しても停止します。

これは私がして来たものです:

$(this).effect("shake"); 

感謝:)

答えて

0

あなたはフラグを使用することができ、余分な変数を使用することができた場合:

first_submit = true 

if(first_submit){ 
    first_submit = false 
    $(this).effect("shake"); 
} 
0

をあなたは、変数を作成することができますエフェクトをアクティブに設定する(実行中)。あなたのサブミットコールがコールバックによって傍受されると、それが真であるかどうかを確認します。別の呼び出しを防止する。

エフェクトコールバック(成功)では、たとえば変数falseを設定します。それがサイクルです。

私はここを見て、それが成功のコールバックするために効果の拡張子を追加しました:ようWhat is the true way of adding callback functionality to custom JQuery Animation?

何か:

// Your new control 
 
var active = false; 
 

 
// Extending callback functionality to the animation 
 
$.fn.shake = function (times, distance, duration, callback) { 
 
    return this.css({ position: 'relative' }).each(function() {    
 
     for (var i = 0, t = duration/times; i < times; i+= 1) { 
 
      $(this). 
 
       animate({ left: -distance }, t/3). 
 
       animate({ left: distance }, t/3). 
 
       animate({ left:   0 }, t/4); 
 
     } 
 

 
     $(this).show(callback); 
 
    }); 
 
}; 
 

 
// DOM load 
 
$(document).ready(function(){ 
 
    
 
    // Triggering form the event 
 
    $('#form_ID').submit({function(){ 
 
    
 
    if(active == true) 
 
     return false; 
 
    
 
    // trigger your event.. 
 
    shake(5, 10, 500, function() { 
 
     $('#your_component_ID').removeClass('shaking'); 
 
    }); 
 
    }); 
 
});

を私はあなたがこの中に見てみることができると思います投稿も:jQuery prevent multiple clicks until animation is done

関連する問題