كيف أقوم بإعداد المؤقت لمنع تداخل مكالمات ajax؟

لدي صفحة تظهر فيها عمليات البحث في الشبكة وفي الخريطة (باستخدام KML ولدت على الطاير ، متراكبة على خريطة Google المضمنة). لقد قمت بتوصيل هذا للعمل كنوع المستخدم ؛ هنا الهيكل العظمي لشفرة بلدي ، والتي تعمل:

$(function() {
   //Wire up search textbox
    $('input.Search').bind("keyup", update);
});

update = function(e) {
   //Get text from search box
   //Pass to web method and bind to concessions grid
    $.ajax({  
        ...
        success: function(msg) {
            displayResults(msg, filterParams);
        },
    });

}

displayResults = function(msg, filterParams) {
       //Databind results grid using jTemplates
       //Show results on map: Pass parameters to KML generator and overlay on map
}

اعتمادًا على البحث ، قد يكون هناك مئات النتائج ؛ وبالتالي فإن العمل الذي يحدث في displayResults هو معالج مكثف على الخادم (الاستعلام عن قاعدة البيانات ، وبناء وتبسيط KML على الطاير) وعلى العميل (ربط شبكة النتائج ، وتراكب ملفات KML كبيرة الملفات على الخريطة).

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

1

3 إجابة

بدلاً من استدعاء update() مباشرة ، استدعاء مجمّع يتحقق لمعرفة ما إذا كانت هناك أي تحديثات مؤجلة مؤجلة:

$('input.Search').bind("keyup", delayedUpdate);

function delayedUpdate() {
    if (updatePending) {
        clearTimeout(updatePending);
    }

    updatePending = setTimeout(update, 250);
}

function update() {
    updatePending = false;

    //$.ajax(...
}

يجب عليك أيضًا أن تضيف:

$('input.Search').bind("blur", update);

سيقوم هذا بإجراء تحديث فوري عندما يترك المستخدم الحقل. ولكن تأكد أيضًا من أنك تضيف معالجة للحالة التي يترك فيها المستخدم الحقل بينما هناك تحديث متأخر مؤجل (قم بإلغاء التحديث المتأخر أولاً).

3
وأضاف
هذا يعمل تماما - شكرا.
وأضاف المؤلف Herb Caudill, مصدر

كنهج أول ، ماذا عن شيء مثل:

$('input.Search').bind("keyup", function() { setTimeout(update, 5) } );

(غير متأكد من بناء جملة setTimeout بالضبط).

يمكنك أيضًا الاحتفاظ بمتغير لتتبع ما إذا كانت المهلة قد تمت جدولتها بالفعل أم لا.

0
وأضاف
هذا سوف يتحمل فعليًا نفس الكمية من الحمل غير الضروري ، بعد الانتظار لمدة 5 مللي ثانية.
وأضاف المؤلف Ates Goral, مصدر

يمكنك استخدام Window.SetTimeOut (YourRefreshMethod) ، عندما يتم استدعاء YourRefereshMethod ، فإنه سيتم التحقق من عدد الأحرف التي يتم كتابتها حتى الآن ، ومقارنتها مع بعض العداد ، سيبدأ العداد بقيمة 0 ، وبالتالي فإن المكالمة الأولية لن تفعل شيئا بخلاف تحديث العداد مع عدد الحروف الحالية المكتوبة ، في المرة الثانية التي يتم فيها استدعاء طريقتك ، سيتحقق من عدد الأحرف المكتوبة ، إذا كان يتطابق مع الرقم السابق المسجل بواسطة العداد ، فهذا يعني أن المستخدم لم يكتب أي شيء جديد ويمكنك إطلاق طريقة التحديث ، وإلا فستقوم بتحديث قيمة العداد

0
وأضاف