質問

この部分の JavaScript は jQuery 1.2.5 で書かれています。これは、私が作成したプラグインの main function() 内に含まれています。このプラグインは、jCarousel によく似た水平ギャラリー スクローラーです。幅の自動計算がたくさん行われ、その幅と画像のサイズに基づいてスクロールする数が決定されます。これがすべての計算です。

私の質問は、前の実行が完了する前にこれが起動しないようにするにはどうすればよいですか。たとえば、ちょっとクリックして喜んで、必死にマッシュダウンした場合 .digi_next. 。そうなると UI でうまくいかないので、それを修正したいと思います :) 答えは次のとおりかもしれないと思いました。 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);
    });
役に立ちましたか？

解決

グローバル ビジー フラグを使用するだけです。クリック ハンドラーを入力するときにそれを確認し、それが false の場合にのみ続行します。すぐに true に設定し、アニメーションが終了したら false に戻します。JavaScript はシングルスレッドであるため、競合状態を心配する必要はありません。

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

他のヒント

を見てみましょう jQuery UI. 。具体的には エフェクト部分 プラグインの。スライドエフェクトを使用しています 私の個人的なウェブサイト (ボックスの横にある矢印をクリックします)。

効果が終了する前に、ユーザーが効果を複数回トリガーすることを防ぎます。 1つ イベントハンドラ そしてコールバック関数。

これがソースコードです

前述のグローバル フラグの代わりに、値を DOM 要素に割り当てることができます。これにより、ページ上の複数の要素が同じ動作を行うことができます。

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

JavaScript 関数の呼び出しは非同期であるため、前の呼び出しが終了したときに呼び出されるコールバック関数を in パラメーターとして渡すことができます (エラーの場合も同様)。

この記事で書いた関数を、以前に起動した関数のコールバックとして渡すことができます。

お役に立てれば。

よろしく

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top