我为自定义商店页面创建了一个模板。我有加载更多 Ajax按钮以显示所有产品。我在template.php中的代码是:
<div class="pageCAtWooct " id="content">
<ul class="products">
<?php
$args = array( 'post_type' => 'product', 'posts_per_page' =>2, 'product_cat' =>$category_slug);
$i=1;
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
global $product;
<li class="product odd">
<a class="aproduct" href="<?php echo get_permalink( $loop->post->ID ) ?>" title="<?php echo esc_attr($loop->post->post_title ? $loop->post->post_title : $loop->post->ID); ?>">
<?php woocommerce_show_product_sale_flash( $post, $product ); ?>
<?php if (has_post_thumbnail( $loop->post->ID )) echo get_the_post_thumbnail($loop->post->ID, 'shop_catalog'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="Placeholder" width="300px" height="300px" />'; ?>
<div class="product-meta1">
<h3><?php the_title(); ?></h3>
<?php do_action("woocommerce_before_add_to_cart_form"); ?>
</div>
</a>
<div class="btnCart">
<span class="price"><?php echo $product->get_price_html(); ?>
</span>
<?php woocommerce_template_loop_add_to_cart( $loop->post, $product ); ?>
</div>
</li>
<?php $i++; endwhile;wp_reset_query(); ?>
<?php wp_reset_query(); global $wp_query;
$max = $loop->max_num_pages;
$paged = ( get_query_var('paged') > 1 ) ? get_query_var('paged') : 1;
$nextpage= get_permalink().'page/1';
?>
</ul><!--/.products-->
<input id="inputPagenumber" value="<?php echo $paged ?>" hidden>
<input id="inputPagemax" value="<?php echo $max ?>" hidden>
<input id="inputPagenext" value="<?php echo $nextpage ?>" hidden>
</div>
我的Ajax代码是:
jQuery(document).ready(function($) {
// The number of the next page to load (/page/x/).
var pageNum =parseInt($('#inputPagenumber').val()) ;
// The maximum number of pages the current query can return.
var max = $('#inputPagemax').val();
// The link of the next page of posts.
var nextLink =$('#inputPagenext').val();
/**
* Replace the traditional navigation with our own,
* but only if there is at least one page of new posts to load.
*/
if(pageNum <= max) {
// Insert the "More Posts" link.
$('#content')
.append('<div class="test pbd-alp-placeholder-'+ pageNum +'"></div>')
.append('<p id="pbd-alp-load-posts"><a href="#">Load More Posts</a></p>');
// Remove the traditional navigation.
$('.navigation').remove();
}
/**
* Load new posts when the link is clicked.
*/
$('#pbd-alp-load-posts a').click(function() {
// Are there more posts to load?
if(pageNum <= max) {
// Show that we're working.
$(this).text('Loading posts...');
$('.pbd-alp-placeholder-'+ pageNum).load(nextLink + ' .post',
function() {
// Update page number and nextLink.
pageNum++;
nextLink = nextLink.replace(/\/page\/[0-9]?/, '/page/'+ pageNum);
// Add a new placeholder, for when user clicks again.
$('#pbd-alp-load-posts')
.before('<div class="pbd-alp-placeholder-'+ pageNum +'"></div>')
// Update the button message.
if(pageNum <= max) {
$('#pbd-alp-load-posts a').text('Load More Posts');
} else {
$('#pbd-alp-load-posts a').text('No more posts to load.');
}
}
);
} else {
$('#pbd-alp-load-posts a').append('.');
}
return false;
});
});
在function.php中:
function my_enqueue_assets() {
wp_enqueue_script( 'ajax-pagination', get_stylesheet_directory_uri() . '/js/ajax-pagination.js', array( 'jquery' ), '1.0', true );
}
add_action('wp_enqueue_scripts','my_enqueue_assets');
但不显示我的产品。我是wordpress的新手。我非常谷歌搜索,但我无法找到我的问题。为什么我的Ajax查询无法成功?