2016-09-12 10 views
0

に次のページを読み込む:http://www.spendeeapp.com/
基本的には、mousescroll機能Wordpressのは、私はWordpressの中で、このページを実装するマウスホイール

の負荷の次のポストを私はjQueryの

$(document).ready(function(){ 
    $(document) 
     .on('mousewheel DOMMouseScroll swipedown swipeup', function(){ 
      // Do something 
     }) 
}); 

PHPスルーmousescrollアクションを複製することができます:

<div id="content"> 
      <h1>Main Area</h1> 
      <?php if (have_posts()) : while (have_posts()) : the_post(); ?> 
       <h1><?php the_title(); ?></h1> 
       <h4>Posted on <?php the_time('F jS, Y') ?></h4> 
       <p><?php the_content(__('(more...)')); ?></p> 
       <hr> <?php endwhile; else: ?> 
       <p><?php _e('Sorry, no posts matched your criteria.'); ?></p><?php endif; ?> 
     </div> 

私の質問は、私は次のイベントスルーポスト、およびディスプレイ番目を読み込むことができる方法であり、 eロードされた投稿。

+0

これはおそらく、ajax – developerwjk

答えて

0

すでに途中です。次に行う必要があることは、ajaxリクエストを作成し、PHPコールバックを使用して次のページをロードすることだけです。コードは次のようになります。コメントに特別な注意を払う。

jQueryの

$.ajax({ 
    url: data.ajax_url, // Localize this variable using Wordpress functions 
    type: 'post', 
    data: { 
     action: 'load_nextpage_page', // The name of php callback (function) 
     // Any other variables you may wish to pass 
    }, 
    success: function(data) { 
     console.log(data); 
     // Here you can use the data returned by you PHP callback 
    } 
}); 

PHP

<?php 

// your-javascript-file-handle is the one you use while enqueuing your JS files in wordpress. Use the same handle in following code 
// to know more about localization visit https://developer.wordpress.org/reference/functions/wp_localize_script/ 

wp_localize_script('your-javascript-file-handle', 'data', array(
    'ajax_url' => admin_url('admin-ajax.php'), 
)); 


// AJAX callback handling 
add_action('wp_ajax_load_nextpage_page', 'load_nextpage_page'); 
add_action('wp_ajax_nopriv_load_nextpage_page', 'load_nextpage_page'); 

function load_nextpage_page() 
{ 
    // Code for fetching next post here 
    // Remember you will need a variable to keep track of which post should be fetched next. 


    // Once you have fetched the right post 
    // you can echo the contents which will be passed as a reposnse to your ajax request. 
} 

私はあなたがこの事を構築する必要があるかもしれませんすべてを概説しています。それがあなたを助けることを願っています

関連する問題