Click loads template via ajax

时间:2015-08-06 作者:wpuser

如果用户单击按钮,我将尝试通过ajax加载模板。这是我正在使用的代码:

在…上functions.php:

function phantom_scripts() {
  global $child_dir;

  /* Ajax Requests */
  wp_enqueue_script( \'ajax-stuff\', get_stylesheet_directory_uri() . \'/js/ajax.js\', array( \'jquery\' ), true );
 }
 add_action( \'wp_enqueue_scripts\', \'phantom_scripts\' );


function portfolio_ajax() {
  include( \'templates/cards.php\' );
  die();
}
add_action(\'wp_ajax_nopriv_portfolio_ajax\', \'portfolio_ajax\');
add_action(\'wp_ajax_portfolio_ajax\', \'portfolio_ajax\');

wp_localize_script( \'ajax-stuff\', \'ajaxStuff\', array( \'ajaxurl\' => admin_url( \'admin-ajax.php\' ) ) );
在上ajax.js:

(function($) {
    $(\'#load-cards\').click(function() {
        alert();
            $.ajax({
                url: ajaxurl,
                data: {
                    action: \'portfolio_ajax\'
                },
                success: function(data) {
                    $(\'#cards-container\').append(data);
                },

                error: function(MLHttpRequest, textStatus, errorThrown){
                    alert(errorThrown);
                }
            });
        });
})(jQuery);
HTML:

<a href="javascript:void(0)" id="load-cards">Load cards</a>
现在,控制台没有向我显示任何错误,但没有加载我在中的内容templates/cards.php 文件知道我错过了什么吗?

2 个回复
最合适的回答,由SO网友:Dougal Campbell 整理而成

那么,你正在使用wp_localize_script 注入ajax url。但您没有使用本地化的var句柄访问该值。尝试以下操作:

/* ... */
$.ajax({
    url: ajaxStuff.ajaxurl, // NOTE use of \'ajaxStuff\' object
/* ... */

SO网友:Lasse M. Tvedt

首先你需要照Dougal说的做ajax-url 正当我还将指定dataType. dataType是您期望从服务器返回的数据类型,您可以阅读更多关于它的信息here.

我会用wordpress的get_template_part 获取模板。

结束