1

我正在使用 wordpress，一个名为 The Events Calendar 的插件（顺便说一句很棒的插件），我正在尝试创建一个带有小导航元素的小部件。导航将显示上个月、当前月和下个月。例如，今天导航会显示“Apr May Jun”。

应该发生的是，当您单击“Jun”时，它应该加载 6 月发生的事件。我想通过 jquery/ajax 魔术将这些加载到指定的 div 中。

我有点让它工作，但我有一个错误，我不知道如何修复它。当我单击初始显示的月份之一时，它可以工作。但是当我再点击一个月时，我失去了我的 jquery 功能（可能是由于页面没有完全重新加载。）

所以，我想知道是否有办法重新初始化导航，以便获得更多点击。

使用代码：

我的 sidebar.php 文件包含以下代码：

一些 HTML

<div id="upcoming-events-box">
<div class="upcoming-events-block-inner">
<div class="upcoming-events-content">

    <div id="EventLoader">
    <?php get_template_part( 'content', 'the-events' ); ?>
    </div>

</div>
</div>
</div>

还有一些jQuery：

<script type="text/javascript">
jQuery(function() {

    jQuery('#upcoming-events-months li a').click(function() {
        var toLoad = jQuery(this).attr('href')+' #EventLoader';
        jQuery('#EventLoader').hide('fast',loadContent);
        jQuery('#load').remove(); 
        jQuery('.upcoming-events-content').append('<span id="load">LOADING...</span>');
        jQuery('#load').fadeIn('normal');


    function loadContent() {
        jQuery('#EventLoader').load(toLoad,'',showNewContent);
    }

    function showNewContent() {
        jQuery('#EventLoader').show('normal',hideLoader);
    }

    function hideLoader() {
        jQuery('#load').fadeOut('normal');
    }
    return false;

    });
});

</script>

侧边栏中调用的 content-the-events.php 包含以下代码：

<div id="upcoming-events-months">
 // Some php
global $post;

$current_page_URL = $_SERVER["SERVER_NAME"];

if (isset($_GET['setmonth'])) {
$current_month = $_GET['setmonth'];
 } else {
$current_month = date('M'); // This gets the current month
}

$next_month = date('M', strtotime('+1 month', strtotime($current_month)));
$prev_month = date('M', strtotime('-1 month', strtotime($current_month)));

echo "<ul>";
echo "<li><a href='http://".$current_page_URL."?setmonth=".$prev_month."'
id='".$prev_month."'>".$prev_month."</a></li>";
echo "<li>".$current_month."</li>";
echo "<li><a href='http://".$current_page_URL."?setmonth=".$next_month."'
id='".$next_month."'>".$next_month."</a></li>";
echo "</ul>";
</div>

<div id="content"></div>

<div class="upcoming-event-scroller">
<?php
$all_events = tribe_get_events(array(
'eventDisplay'=>'all',
'posts_per_page'=>-1,
'start_date'=>'01 '.$current_month.' 2012',
'end_date'=>'31 '.$current_month.' 2012'
));

foreach($all_events as $post) {
setup_postdata($post);
?>
<div class="row <?php echo (++$j % 2 == 0) ? 'even' : 'odd'; ?>">
<p><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></p>
<p class="event-date"><a href="<?php the_permalink(); ?>"><?php echo tribe_get_start_date($post->ID, true, 'M j, Y'); ?> - <?php echo tribe_get_end_date($post->ID, true, 'M j, Y'); ?></a></p>
</div>

<?php } //endforeach ?>
<?php wp_reset_query(); ?>
</div>

也许我只是让自己很困惑试图弄清楚这一点。哈哈。任何帮助将不胜感激。

4

0 回答 0