我不确定您是否还在解决这个问题,我使用的是F4,因此可能不是完全相同的问题,但我将Reveal与WP的内置AJAX结合起来检索内容。我将在下面添加代码的相关部分:
下面是插件代码:
public function __construct() {
self::$dir = plugin_dir_path( __FILE__ );
self::$url = plugin_dir_url( __FILE__ );
add_action( \'wp_enqueue_scripts\', array($this, \'include_scripts\' ));
add_action( \'wp_ajax_load-content\', array($this, \'load_ajax_content\' ));
add_action( \'wp_ajax_nopriv_load-content\', array($this, \'load_ajax_content\' ));
}
public function include_scripts() {
if ( is_page(\'sketchbook-pages\' ) ) {
// embed the javascript file to make the AJAX request
wp_enqueue_script( \'reveal\', get_template_directory() . \'/js/foundation/foundation.reveal.js\', array( \'jquery\', \'reverie-js\' ), \'\', true );
wp_enqueue_script( \'my-ajax-request\', self::$url . \'js/sketchbook_ajax.js\', array( \'jquery\' ) );
wp_localize_script( \'my-ajax-request\', \'MyAjax\', array( \'ajaxurl\' => admin_url( \'admin-ajax.php\' ) ) );
}
}
/**
* Function to call the content loaded for logged-in and anonymous users
*/
public function load_ajax_content ( $post_id ) {
$post_id = $_POST[ \'post_id\' ];
if (has_post_thumbnail($post_id)) {
$sketch_id = get_post_thumbnail_id($post_id);
$attachment = get_post( $sketch_id );
$caption = $attachment->post_excerpt;
$response = \'<figure>\'. get_the_post_thumbnail($post_id, \'large-sketch\') .\'<figcaption><p>\'. $caption .\'</p></figcaption></figure>\' . $this->paging_link_nav( $post_id );
echo $response;
}
die(1);
}
(function($) {
$.fn.displayPost = function() {
$(this).click(function(event){
event.preventDefault();
//event.stopPropagation;
var post_id = $(this).data("id");
var id = "#" + post_id;
// Check if the reveal modal for the specific post id doesn\'t already exist by checking for it\'s length
if($(id).length == 0 ) {
// We\'ll add an ID to the new reveal modal; we\'ll use that same ID to check if it exists in the future.
var modal = $(\'<div>\').attr(\'id\', post_id ).addClass(\'reveal-modal\').appendTo(\'body\');
var ajaxURL = MyAjax.ajaxurl;
$.ajax({
type: \'POST\',
url: ajaxURL,
data: {"action": "load-content", post_id: post_id },
success: function(response) {
modal.empty().html(response).append(\'<a class="close-reveal-modal">×</a>\').foundation(\'reveal\', \'open\');
modal.bind(\'opened\', function() {
// Trigger window resize to reset the left margin.
$(window).trigger(\'resize\');
var left;
left = Math.max($(window).width() - $(id).outerWidth(), 0) / 2;
$(id).css({
left:left + $(window).scrollLeft()
});
$(\'.previous-sketch,.next-sketch\').displayPost($(this));
return false;
});
}
});
}
//If the div with the ID already exists we\'ll just open it.
else {
$(id).foundation(\'reveal\', \'open\');
}
// Recalculate left margin on window resize
$(window).resize(function(){
var left;
left = Math.max($(window).width() - $(id).outerWidth(), 0) / 2;
$(id).css({
left:left + $(window).scrollLeft()
});
});
});
}
})(jQuery);
这是sketchbook\\u ajax。js公司:
jQuery(document).ready(function($) {
$(\'.reveal\').displayPost($(this));
// First retrieve the post id from the selectors data-id
});
我已经让它工作了,但是分页模式窗口仍然有点麻烦。