2015-05-09 2 views
0

мне удалось реализовать бесконечный свиток с кладкой в ​​WordPress, и это работает, но у меня есть несколько ошибок:Кладка + Infintine проблемы реализации прокрутки

Столбы должны быть открыты в AJAX, но это не работает для добавленные элементы теперь, только для первых нескольких.

После того, как все сообщения отображаются, консоль выводит ошибку: GET http://www.jcvergara.com/working/page/3/?_=1431138637809 404 (не найдено). Я не уверен, с чем это связано. Я был бы признателен за любые идеи, как это исправить.

Вот мой код:

<div class="main"> 
    <div id="content" class="container"> 
     <div class="right-line"></div> 

     <!-- List of categories, only on the first page --> 
     <?php 
       $cur_url = $_SERVER['REQUEST_URI']; 
       if ($cur_url == '/working/') { 
        echo '<div class="item tags">'; 
        echo '<div class="item-title">'; 
        echo '<span class="tag">Tags</span>'; 
        echo '<ul><li><a href="/working/" class="active">All</a></li>'; 
        wp_list_categories('orderby=term_group&title_li='); 
        echo '</ul></div></div>'; 
       } 

      ?> 

     <!-- Posts --> 
     <?php if (have_posts()) : ?> 
      <?php while (have_posts()) : the_post(); ?> 
       <?php $category = get_the_category(); ?> 
       <div class="item <?php echo $category[0]->slug; ?>"> 
        <a class="mask post-link" rel="<?php the_ID(); ?>" href="<?php the_permalink(); ?>"></a> 
        <div class="item-title"> 
         <span class="tag"> 
          <?php echo $category[0]->cat_name; ?> 
         </span> 
         <h4><?php the_title(); ?></h4> 
        </div> 
        <div class="item-img"> 
         <?php if (has_post_thumbnail($post->ID)): ?> 
          <?php $image = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'single-post-thumbnail'); ?> 
          <div class="thumb" style="background-image: url('<?php echo $image[0]; ?>'); "></div>         
         <?php endif; ?> 
        </div> 
        <div class="item-text"> 
         <?php the_excerpt(); ?> 
         <span class="more"><a href="#">Read more...</a></span> 
        </div> 
       </div> 
      <?php endwhile; ?> 
     <?php endif; ?> 
     <div class="clear"></div>  
    </div> 
    <?php the_posts_navigation(); ?> 
</div> 

Код для открытия сообщения в AJAX:

$(document).ready(function(){ 
$.ajaxSetup({cache:false}); 
$('.post-link').click(function(){ 
    $('.openarticle').css('display', 'block'); 

    var post_link = $(this).attr('href'); 

    $('#openthis').html('<div class="title"><h2>Loading..</h2><div class="text"></div>'); 
    $('#openthis').load(post_link); 
    $('<a></a>', { 
     text: 'Close', 
     class: 'close', 
     id: 'close', 
     href: '#' 
    }) 
    .prependTo($('.openarticle .main')) 
    .click(function() { 
     $('.openarticle').css('display', 'none'); 
     $('#close').remove(); 
    });  
    return false;   
}); 
}); 

Вот ссылка: http://www.jcvergara.com/working/

Спасибо заранее.

ответ

1

Вам необходимо добавить код для открытия сообщений в функции обратного вызова бесконечного прокрутки. (BTW, вы должны фактически указать конкретный код для бесконечного прокрутки и свой код, чтобы открыть сообщение в своем вопросе, а не просто ссылку).

Вот часть кода с бесконечной прокруткой, которая должна помочь:

 function(newElements) { 
      var $newElems = $(newElements); 
      $container.masonry('appended', $newElems); 
    //add this to your code 

    $('.post-link').click(function(){ 
    $('.openarticle').css('display', 'block'); 

    var post_link = $(this).attr('href'); 

    $('#openthis').html('<div class="title"><h2>Loading..</h2><div class="text"></div>'); 
    $('#openthis').load(post_link); 
    $('<a></a>', { 
     text: 'Close', 
     class: 'close', 
     id: 'close', 
     href: '#' 
    }) 
    .prependTo($('.openarticle .main')) 
    .click(function() { 
     $('.openarticle').css('display', 'none'); 
     $('#close').remove(); 
    }); 
    return false; 
    }); 

     } 

Ваше сообщение об ошибке относится к не будучи страница 3, чтобы загрузить на infinitescroll

+0

Спасибо, я не знал об обратном вызове. Работала отлично. – elkah

+0

Что касается ошибки консоли, я вижу, что она связана со страницей 3, которая не существует в этом случае. Я не понимаю, почему он запрашивает страницу 3. Есть ли у вас какие-то идеи случайно? Я разместил здесь полный код каменной кладки-бесконечного прокрутки: https://jsfiddle.net/zu97m04c/. Благодарю. – elkah