创建onClick事件以重新加载小部件

时间:2017-01-30 作者:Jake Hope

嘿,伙计们,我有一个“添加到收藏夹”按钮,当点击该按钮时,会将帖子添加到用户可以在页面/我的查询列表/上查看的列表中。

我已经创建了一个小部件,显示用户列表中的收藏夹数量:

if ($favorite_post_ids):
    $c = 0;
    $i = 0;
    $favorite_post_ids = array_reverse($favorite_post_ids);
    foreach ($favorite_post_ids as $post_id) {
        if ($c++ == $limit) break;
        $i = $i+1;
    }
endif;
echo "<div id=\'favourite-list\'><a class=\'submit-small-button button\' title=\'Favourites List\' href=\'/my-favourites-list/\'><i>" . $i . "</i> My Favourites List </a></div>";
我遇到的问题是,用户必须刷新页面才能看到页面上出现的(喜欢的帖子)数量(使用上面的小部件)。

我真正想要实现的是,当用户单击“添加到收藏夹”按钮时,上面小部件中的计数器将增加,而不会刷新。

以下是“添加到收藏夹”按钮的代码:

function wpfp_link_html($post_id, $opt, $action) {
    $link = "<a class=\'wpfp-link\' href=\'?wpfpaction=".$action."&amp;postid=". esc_attr($post_id) . "\' title=\'". $opt ."\' rel=\'nofollow\'>". $opt ."</a>";
    $link = apply_filters( \'wpfp_link_html\', $link );
    return $link;
}
我对这一切都是全新的,所以如果这是一个不合理的问题,请原谅我。

提前谢谢你,希望你能帮助我!

1 个回复
SO网友:BlueSuiter

我想你是这样的。

HTML将此添加到小部件中

<a href="javascript:void(0)" id="add_my_fav">Add To Favourite<span id="favCount"></span></a>
Ajax将此添加到模板中

<?php $nonce = wp_create_nonce(\'addToFav\'); ?>
<script>
jQuery(document).read(function(){
    jQuery.ajax({
        url: \'http://example.com/wp-admin/admin-ajax.php\',
        data: {action:"add_to_favourite", secret:"<?php echo $nonce; ?>"},
        method: \'POST\',
        success: function(res){
            jQuery(\'#favCount\').html(res);
        }
    })
})
</script>
PHP在函数中添加此项。php

function addToFavourite(){
   if(isset($_POST[\'secret\']) && wp_verify_nonce($_POST[\'secret\']))
   {
       // Add here your code to add favourite

       // return new count value
   }
}
add_action(\'wp_ajax_add_to_favourite\', \'addToFavourite\' );
add_action(\'wp_ajax_nopriv_add_to_favourite\', \'addToFavourite\' );

相关推荐

自定义模板earch.php中的搜索结果

现在我在搜索结果页面(search.php)中遇到了一个问题,结果是由索引页面模板显示的,而不是它的模板,它显示所有帖子,不管搜索者是否输入了内容我的索引。php页面<?php get_header(); ?> <?php $search = $_get[\'search\']; $args = array( \'post_title_like\' => $search ); $res = new wp_query($args