تنفيذ مسج عند النقر

Question

لدي هذا الجزء من جافا سكريبت المكتوب باستخدام 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);
    });

Answer 1

ما عليك سوى استخدام علامة مشغول عالمية.عند إدخال معالج النقرات، تحقق منه، ثم تابع فقط إذا كان خاطئًا.اضبطه فورًا على "صحيح"، ثم أعده إلى "خطأ" عندما تنتهي الرسوم المتحركة.جافا سكريبت هي لغة مفردة، لذلك لا توجد حالة سباق تدعو للقلق.

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

Answer 2

نلقي نظرة على واجهة مستخدم مسج.خاصة الجزء الآثار من المكونات.أستخدم تأثير الشريحة على موقعي الشخصي (انقر على الأسهم الموجودة على جانبي المربعات).

أمنع المستخدمين من تشغيل التأثير أكثر من مرة - قبل انتهاء التأثير - باستخدام ملف واحد معالج الحدث ووظيفة رد الاتصال.

وهنا الكود المصدري

Answer 3

كبديل للعلامة العامة المذكورة، يمكنك تعيين القيمة لعنصر DOM، وبهذه الطريقة تمكن عناصر متعددة في الصفحة من أن يكون لها نفس السلوك:

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

Answer 4

نظرًا لأن استدعاءات وظائف JavaScript غير متزامنة، يمكنك تمرير وظيفة رد اتصال كمعلمة يتم استدعاؤها عند انتهاء الاستدعاء السابق (نفس الشيء بالنسبة للأخطاء).

يمكنك تمرير الوظيفة التي كتبتها في هذا المنشور كرد اتصال للوظيفة التي تم إطلاقها من قبل.

أتمنى أن يساعدك هذا.

يعتبر