it-swarm.asia

تحميل المزيد من المحتوى مع ajax عند النقر فوق ارتباط أكثر في طريقة عرض

لدي عرض كتلة مخصص. أعرض آخر 5 عناوين العقدة. إذا قام شخص ما بالنقر فوق المزيد من الارتباط ، أريد تحميل العناوين الخمسة التالية أسفل عناوين العقدة الخمس الحالية. لا تحديث الصفحة وليس النداء. هل هذا ممكن؟ كيف لي أن تذهب عن القيام بذلك؟

15
Lucy

هذه إحدى المشاكل التي حاول العديد من الأشخاص في drupal عالم حلها.

لقد قدمت مؤخرًا عرضًا تقديميًا حول نفس المشكلة بالضبط وكيفية تحقيقها باستخدام دروبال. للأسف لم أقم بنشر أي من الشرائح الخاصة بي في أي مكان حيث يمكن لبقية العالم رؤيتها.

إليك تقسيم الوحدات:

مرر مشاهدات لانهائية

  • لا يعمل مع دعم Views Ajax - يتسلل من حوله لتقديم طلب خاص بأجاكس
  • يجعل طلب صفحة كاملة - هذا لأنه لا يستخدم طلب Views Ajax
  • يتطلب المشاهدات 3.x - هذا زائد ، لأن جهاز النداء قادر على التوصيل في 3.x

المشاهدات اللانهائية بيجر

  • طرق عرض الدعم 2.x - هذا ليس بالشيء الجيد حقًا ، لأن جهاز النداء غير قادر على التوصيل
  • لأنه يعمل مع الإصدار 2.x ، فإنه يخترق بالفعل موضوع النداء ، وجهات النظر المنتظمة ، وسلوك المعالجة المسبقة. لذلك يكسر بعض الوظائف.

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

تحميل المشاهدات أكثر

  • يتطلب المشاهدات 3.x - هذا عن قصد.
  • عرض الدعم خيارات النداء العادية ، مثل الإزاحة ، عدد الصفحات
  • يدعم ميزة ajax المشاهدات
    • إذا تم تمكين Ajax في العرض ، فسيؤدي التحميل الإضافي إلى إضافة محتوى إلى أسفل القائمة
    • إذا تم تعطيل ajax ، سيتم تحديث الصفحة واستبدال المحتوى القديم بالمحتوى الجديد
    • لا يقوم بطلب صفحة كاملة عند القيام باستدعاء ajax ، فهو يتيح للمشاهدة القيام باستدعاء طبيعي وبدلاً من استبدال المحتوى الذي يلحق به.
  • إذا كنت تستخدم waypoint الوحدة النمطية ، يمكن تكوين العرض تلقائيًا للحصول على محتوى جديد عندما يقوم المستخدم بالتمرير إلى أسفل الصفحة.
  • يدعم تأثيرات JQuery (في الوقت الحالي يتم دعم تأثير التلاشي فقط ، المزيد قريبًا).

آمل أن يجيب هذا على سؤالك. هذا هو رأيي "غير متحيز" ؛-) على جميع طرق العرض تحميل المزيد من الوحدة النمطية.

26
ericduran

طريقة أخرى باستخدام https://github.com/paulirish/infinite-scroll in Drupal is تحويل أي Drupal = البيجر في جهاز آلي - بيجر التمرير اللانهائي - تحميل المزيد من البيجر .

الخطوة 1

تنزيل jquery.infinitescroll.min.js من https://github.com/paulirish/infinite-scroll ووضعه في /sites/all/themes/YOURTHEME/js/jquery.infinitescroll.min. شبيبة.

الخطوة 2

أضف ملف JavaScript إلى ملف .info الخاص بموضوعك.

الخطوه 3

قم بإنشاء ملف JavaScript مخصص /sites/all/themes/YOURTHEME/js/YOURTHEME.js يحتوي على الكود التالي.

/**
 * Implementation of autopager @see https://github.com/paulirish/infinite-scroll
 * All views that have the "autopager" class will have an autopager
 */
Drupal.behaviors.viewsInfiniteScroll = function(context) {
  $(function(){
    var $container = $('div.autopager div.view-content');    
    $container.imagesLoaded( function(){
      $container.infinitescroll({
        navSelector  : 'div.autopager .pager',    // selector for the paged navigation
        nextSelector : 'div.autopager .pager-next a',  // selector for the NEXT link (to page 2)
        itemSelector : 'div.autopager .views-row',     // selector for all items you'll retrieve
        loading: {
          finishedMsg: 'No more pages to load.',
          img: '/sites/all/themes/YOURTHEME/images/loading.gif'
        }
      })
    })
  });
}

الخطوة 4

أضف CSS لمحمل التمرير اللانهائي

#infscr-loading {
  position: fixed;
  text-align: center;
  bottom: 300px;
  left: 42%;
  z-index: 100;
  background: white;
  background: hsla( 0, 0%, 100%, 0.9 );
  padding: 20px;
  color: #222;
  font-size: 15px;
  font-weight: bold;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

الخطوة الخامسة

تأكد من أن إصدار jquery أحدث من 1.7.1. استخدم إحدى الطرق الموضحة في http://drupal.org/node/1058168 لتثبيت إصدار أحدث من jQuery في دروبال.

2
Hans Rossel

لا يمكنني إضافة تعليق على الجواب الأول. ولكن يجب عليك إضافة الوحدة الجديدة: https://www.drupal.org/project/Gd_infinite_scroll تتيح هذه الوحدة تحويل أي محتوى ونداء إلى تمرير لا نهائي أو تحميل المزيد من أجهزة النداء.

من صفحة الوحدة:

توفير إدارة لاستخدام المكوّن الإضافي jQuery التمرير اللامتناهي: الترحيل التلقائي على الصفحات المخصصة باستخدام النداء. يمكنك استخدام التحميل التلقائي على التمرير أو زر تحميل المزيد.

1
vincent