如何加载字preSS邮政与阿贾克斯的onclick [英] How to load Wordpress Post with Ajax onclick
问题描述
我已经花了几个小时阅读和尝试教程。我似乎无法找到一个解决方案,工程,我知道它应该是pretty的容易,但我与AJAX斗争。 :(
I have spent hours reading and trying tutorials. I cant seem to find a solution that works and I know it should be pretty easy but I struggle with AJAX. :(
我想从一个div链路负载帖子的内容。 下面是我。是否有人可以帮助我的JavaScript的一面呢?谢谢!
I want to load Post content from a link in a div. Below is what I have. Can someone please help me with the JavaScript side? Thanks!
<ul>
<?php query_posts('post_type=artwork&posts_per_page=-1'); ?>
<?php if(have_posts()) : while(have_posts()) : the_post(); ?>
<li class="mytab">
<span>
<h3><?php the_title(); ?></h3>
<a href="#"><?php the_post_thumbnail('Project'); ?></a>
</span>
</li>
<?php endwhile; endif; wp_reset_query(); ?>
</ul>
<div id="loadAjaxHere"></div>
我希望加载这个code在DIV #loadAjaxHere
I want to load this code in div #loadAjaxHere
<div class="myArtwork">
<h2><?php the_title(); ?></h2>
<div class="text"><?php the_content(); ?></div>
</div>
感谢您的帮助!
推荐答案
好吧, 我想,以后的试验和错误的一个长期的过程我已经解决了这个。
Ok, I think I have solved this after a long process of trial and error.
这似乎工作,但请让我知道如果不这样做的正确方法
This seems to work, but please let me know if it is not the correct way of doing this
JavaScript的:
Javascript:
jQuery.noConflict();
jQuery(document).ready(function($){
$.ajaxSetup({cache:false});
$("a.ajax").click(function(){
var post_url = $(this).attr("href");
var post_id = $(this).attr("rel");
$("#tabs").html('<div class="loading">loading...</div>');
$("#tabs").load(post_url);
return false;
});
});
在这里我想(我用所谓的艺术作品自定义文章类型显示帖子内容的页面:
The page where I want to display the post content (I am using custom post types called "artwork":
<ul class="container">
<?php query_posts('post_type=artwork&posts_per_page=-1'); ?>
<?php if(have_posts()) : while(have_posts()) : the_post(); ?>
<li class="mytab">
<h3><?php the_title(); ?></h3>
<a href="<?php the_permalink(); ?>" rel="<?php the_ID(); ?>" class="ajax"><?php the_post_thumbnail('Project'); ?></a>
</li>
<?php endwhile; endif; wp_reset_query(); ?>
</ul>
<!-- LOAD SINGLE POST CONTENT IN #TABS -->
<div id="tabs"></div>
和单后单artwork.php。注意:不要使用get_header或get_footer等:
And the single post "single-artwork.php". Note: Dont use get_header or get_footer etc:
<?php if(have_posts()) : while(have_posts()) : the_post(); ?>
<div class="tabcontent" id="tab-<?php the_ID(); ?>">
<?php the_content(); ?>
</div>
<?php endwhile; endif; ?>
谢谢!
这篇关于如何加载字preSS邮政与阿贾克斯的onclick的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!