ajax分页在wordpress中不起作用 [英] ajax pagination not working in wordpress
问题描述
我正在尝试在wordpress中使用ajax进行分页.我写了下面的代码.分页效果很好，但是当我单击分页按钮时，整个页面都刷新了.
我是wordpress的新手.
请告诉我我在做什么错.
header.php中的代码
....
<?php
/*我们向带有注释形式的页面添加一些JavaScript
*支持带有主题注释的网站(使用时).
*/
if(is_singular()&& get_option(``thread_comments''))
wp_enqueue_script(``comment-reply'');
/*始终在结束</head>
之前有wp_head()
*您主题的标签，否则您将破坏很多插件，
*通常使用此钩子将元素添加到< head>这样的
*作为样式，脚本和元标记.
*/
wp_head();
?>
< script type ="text/javascript">
jQuery(''#Pagination a'').live(''click''，function(e){//检查何时单击分页链接并停止其动作.
e.preventDefault();
var link = jQuery(this).attr(''href''); //获取href属性
jQuery(''#content'').fadeOut(500，function(){//淡出内容区域
jQuery(#loader").show(); //显示加载器动画
}).load(link +''#content''，function(){jQuery(''#content'').fadeIn(500，function(){//从分页器链接页面的内容区域加载数据刚从顶部获得
jQuery(#loader").hide(); //隐藏装载程序
}); });
});
</script>
........
function.php
函数分页($ pages =''''，$ range = 1){/*处理分页的分页*/
$ showitems =($ range * 2)+1;
全局$ paged;
if(empty($ paged))$ paged = 1;
if($ pages =='''')
{
全局$ wp_query;
$ pages = $ wp_query-> max_num_pages;
if(！$ pages)
{
$ pages = 1;
}
}
if(1！= $ pages)
{
回声< div class = \"分页\"id = \"分页\>< span>页面".$ pages.</span>"的页面.$ paged.";
if($ paged> 2&& $ paged> $ range + 1&& $ showitems< $ pages)echo< a href =".get_pagenum_link(1)."''> ;« First</a>;
if($ paged> 1&& $ showitems< $ pages)echo< a href =".get_pagenum_link($ paged-1)."''>" lsaquo;上一页</a> ;;
for($ i = 1; $ i< = $ pages; $ i ++)
{
if(1！= $ pages&((！($ i> = $ paged + $ range + 1 || $ i< = $ paged- $ range-1)|| $ pages< = $ showitems) )
{
回声($ paged == $ i)? < span class = \" current \>".$ i.</span>" ::< a href =".get_pagenum_link($ i).""class = \"无效\>".$ i.</a>";
}
}
if($ paged< $ pages& $ showitems< $ pages)回显< a href = \".get_pagenum_link($ paged + 1)." \>下一个& rsaquo;< /a>;
if($ paged< $ pages-1&& $ paged + $ range-1< $ pages&& $ showitems< $ pages)echo< a href =".get_pagenum_link($ pages ).''>最后的& raquo;</a>";
回声</div> \ n";
}
}
mypage.php
< div class ="wrapper bg-color">
< div id ="wrapper">
< div class ="clearfix">
< div class ="clear"></div>
< div class ="three-column" id ="content">
<?php
$ cat_name ="offer";
$ args = array(``posts_per_page''=> 2，``paged''=> $ paged，``category_name''=> $ cat_name，``orderby''=>``post_date'' ，``order''=>''DESC'');
$ wp_query =新的WP_Query($ args);
if($ wp_query-> have_posts())而($ wp_query-> have_posts()):$ wp_query-> the_post();
$ pop_img = wp_get_attachment_image_src(get_post_thumbnail_id($ post-> ID));
?>
< div class ="one-column margin-Left">
< div class ="sub-title"><?php the_title(); ?></div>
< div class ="bg1">< img src =<?php echo $ pop_img [0];?>" alt ="view" height ="250px" width ="280px"/></div>
</div>
<?php endwhile; ?>
</div>
< div class ="pagebtn" align ="center">
<?php pagination(); ?>
</div>
I am trying to apply pagignation with ajax in wordpress . i have write following code. pagination work good but when i click to paging button the whole page is refreshing.
i am new to Ajax with wordpress.
pls suggest me what wrong i am doing.
code in header.php
....
<?php
/* We add some JavaScript to pages with the comment form
* to support sites with threaded comments (when in use).
*/
if ( is_singular() && get_option( ''thread_comments'' ) )
wp_enqueue_script( ''comment-reply'' );
/* Always have wp_head() just before the closing </head>
* tag of your theme, or you will break many plugins, which
* generally use this hook to add elements to <head> such
* as styles, scripts, and meta tags.
*/
wp_head();
?>
<script type="text/javascript">
jQuery(''#Pagination a'').live(''click'', function(e){ //check when pagination link is clicked and stop its action.
e.preventDefault();
var link = jQuery(this).attr(''href''); //Get the href attribute
jQuery(''#content'').fadeOut(500, function(){ //fade out the content area
jQuery("#loader").show(); // show the loader animation
}).load(link + '' #content'', function(){ jQuery(''#content'').fadeIn(500, function(){ //load data from the content area from paginator link page that we just get from the top
jQuery("#loader").hide(); //hide the loader
}); });
});
</script>
........
function.php
function pagination($pages = '''', $range =1) { /* handle pagination for post pages*/
$showitems = ($range * 2)+1;
global $paged;
if(empty($paged)) $paged = 1;
if($pages == '''')
{
global $wp_query;
$pages = $wp_query->max_num_pages;
if(!$pages)
{
$pages = 1;
}
}
if(1 != $pages)
{
echo "<div class=\"pagination\" id=\"Pagination\"><span>Page ".$paged." of ".$pages."</span>";
if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo "<a href=''".get_pagenum_link(1)."''>« First</a>";
if($paged > 1 && $showitems < $pages) echo "<a href=''".get_pagenum_link($paged - 1)."''>‹ Previous</a>";
for ($i=1; $i <= $pages; $i++)
{
if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems ))
{
echo ($paged == $i)? "<span class=\"current\">".$i."</span>":"<a href=''".get_pagenum_link($i)."'' class=\"inactive\">".$i."</a>";
}
}
if ($paged < $pages && $showitems < $pages) echo "<a href=\"".get_pagenum_link($paged + 1)."\">Next ›</a>";
if ($paged < $pages-1 && $paged+$range-1 < $pages && $showitems < $pages) echo "<a href=''".get_pagenum_link($pages)."''>Last »</a>";
echo "</div>\n";
}
}
mypage.php
<div class="wrapper bg-color" >
<div id="wrapper">
<div class="clearfix">
<div class="clear"></div>
<div class="three-column" id="content">
<?php
$cat_name="offer";
$args = array(''posts_per_page'' => 2,''paged'' => $paged, ''category_name'' => $cat_name, ''orderby''=>''post_date'', ''order''=>''DESC'' );
$wp_query = new WP_Query($args);
if ( $wp_query->have_posts() ) while ($wp_query->have_posts()) : $wp_query->the_post();
$pop_img = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID) );
?>
<div class="one-column margin-Left">
<div class="sub-title"><?php the_title(); ?></div>
<div class="bg1"><img src="<?php echo $pop_img[0]; ?>" alt="view" height="250px" width="280px"/></div>
</div>
<?php endwhile; ?>
</div>
<div class="pagebtn" align="center">
<?php pagination(); ?>
</div>
推荐答案
pages =''''，
pages = '''',
范围= 1){/*处理分页发布页面*/
range =1) { /* handle pagination for post pages*/
showitems =(
showitems = (
这篇关于ajax分页在wordpress中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
