jqtouch - يحدث أي وقت تحميل ، إضافة فئة تحميل؟

Question

أنا أستخدم JQTouch وفي JQTouch يتم تحميل العديد من الروابط عبر AJAX ثم الانزلاق. المشكلة هي أنه لا يوجد مؤشر تحميل يتم توفيره للمستخدمين.

أرغب في إضافة طريقة لإضافة فئة تحميل باستخدام Ajax Spinner ، عندما يتم تحميل مكالمة Ajax ، وإزالة الفئة عند الانتهاء من التحميل ، ويتم عرض الصفحة.

أيه أفكار؟

Answer 1

هذا هو السلوك الأساسي إذا كانت روابطك هي عناصر li class = "السهم". كيف ستعرض الروابط الخاصة بك وأين تريد عرض التحميل؟

Answer 2

إجابة showpagebyhref () صحيحة جزئيا.

لكن بدلاً من

$('body').append('<div id="loadinginprogress">Loading...</div>');

انت تحتاج

$('.current').append('<div id="loadinginprogress">Loading...</div>');

الجسم عام للغاية بالنسبة لـ JQTouch ، ويجب أن يكون خاصًا بـ Div-Page المعروض حاليًا

Answer 3

وظيفة showpagebyhref () في jqtouch JS هي بداية جيدة. لقد أضفتها مباشرة إلى مكالمة Ajax ، لذا لن تومض من فضلك الانتظار عند النقر على الرابط الذي تم تحميله بالفعل وما إلى ذلك.

باختصار - أضف تحميل div (معرف التحميل في exmaple) مباشرة قبل استدعاء Ajax وإزالة "النجاح" أو "الخطأ" لاحقًا. سيبدو قسم مكالمات Ajax شيئًا كهذا (تقصيره):

function showPageByHref(href, options) {
...
if (href != '#'){
    $('body').append('<div id="loadinginprogress">Loading...</div>');
    $.ajax({
        url: href,
        data: settings.data,
        type: settings.method,
        success: function (data, textStatus) {
            $('#loadinginprogress').remove()
            var firstPage = insertPages(data, settings.animation);
            if (firstPage)
            {
                if (settings.method == 'GET' && jQTSettings.cacheGetRequests && settings.$referrer)
                {
                    settings.$referrer.attr('href', '#' + firstPage.attr('id'));
                }
                if (settings.callback) {
                    settings.callback(true);
                }
            }
        },
        error: function (data) {
            $('#loadinginprogress').remove()
            if (settings.$referrer) settings.$referrer.unselect();
            if (settings.callback) {
                settings.callback(false);
            }
        }
    });
}
...
}

سيكون CSS لتحميل Div شيء مثل:

#loadinginprogress {
    -webkit-border-radius: 10px;
    background-color: rgba(0,0,0,.5);
    color: white;
    font-size: 18px;
    font-weight: bold;
    height: 80px;
    left: 60px;
    line-height: 80px;
    margin: 0 auto;
    position: absolute;
    text-align: center;
    top: 120px;
    width: 200px;
    z-index: 5000;
}

Answer 4

شكرا لك على مشاركاتك المختلفة. لقد ساعدوني كثيرًا.

لدي حل لاقتراحه دون تصحيح رمز JQTouch الذي يعتمد عليه JQTouch. ويستخدم قدرات jQuery Ajax.

$(document).ready(function() {
...
  $('#jqt').ajaxStart(function() {
    console.log("ajaxStart");
    ...
  }).ajaxSuccess(function() {
    console.log("ajaxSuccess");
    ... 
  }).ajaxError(function() {
    console.log("ajaxError");
    .... 
  });
....
});

مزيد من التفاصيل المتاحة في صفحة Doc Jquery هذه.

Answer 5

يمكنك إضافة معالج حدث مخصص ، وتشغيل التحميل. في كل مرة يتم تنفيذ النقر على العنصر المحدد.

Answer 6

لقد أجبت للتو دارين باركر سؤال. فقط تحقق من ذلك قد يساعدك.