Ajax WordPress 帖子弹出窗口与 SimpleModal 和 jQuery - Ajax WordPress post popup with SimpleModal and jQuery

Ajax WordPress post popup with SimpleModal and jQuery

我试图在这里实现这个模式 http://wordpressthemescollection.com/ajax-wordpress-post-popup-with-simplemodal-and-jquery-488.html 但似乎没有任何效果。

这就是我所做的。

1/包含在标题中

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="<?php bloginfo("template_url"); ?>/js/jquery.simplemodal.js"></script>`

链接是商品，因为我检查了它们。

2/在标题中包含此脚本

<script>
jQuery(document).ready(function() {
    jQuery('a.postpopup').live('click', function(){
        var id = jQuery(this).attr('rel');
        jQuery('<div id="ajax-popup"></div>').hide().appendTo('body').load('<?php bloginfo('url')?>/ajax/?id='+id).modal({
           opacity:90,
           position: ["0%"],
           overlayClose:true
        });
        return false;
    });
});
</script>

3/使用此代码创建自定义模板

<?php
/*
Template Name: Ajax
*/
?>
<?php
    $post = get_post($_GET['id']);
?>
<?php if ($post) : ?>
    <?php setup_postdata($post); ?>
    <div class="whatever">
        <h2 class="entry-title"><?php the_title() ?></h2>
        <div class="entry-content">
            <?php the_content(); ?>
        </div>
    </div>
<?php endif; ?>

之后制作了一个名为Ajax的页面并分配了Ajax模板。

4/实现链接

<a href="javascript:;" rel="257" class="postpopup">this link</a>

如果我点击链接，什么也没发生。我做错了什么，因为我对此一无所知？谢谢。

jQuery .load（）是 ajax，所以你需要在回调中做任何后续的事情，如下所示：

var $ajax-div = jQuery('<div id="ajax-popup"></div>').hide().appendTo('body');
var url = '<?php bloginfo('url')?>/ajax/?id=' + id;
$ajax-div.load(url), function() {
    // the callback
    jQuery('#ajax-popup').modal({
        opacity: 90,
        position: ["0%"],
        overlayClose:true
    });
});

当您在WordPress管理上创建新的帖子或页面内容时，请为您的页面选择"Ajax"模板