通过AJAX加载也使用AJAX的插件

时间:2014-01-24 作者:Manolo

我遇到了一些使用Ajax的“联系人表单”插件的问题。问题是我使用Ajax调用插件。然后加载插件,但当我尝试提交表单时,我被重定向到以下URL:SITE/wp-admin/admin-ajax.php, 当它应该发送Ajax请求时0 打印在窗口上。

我认为我正确地使用了Ajax:

functions.php:

function theme_name_scripts() {

    wp_enqueue_script( \'mi-script-ajax\',get_bloginfo(\'stylesheet_directory\') . \'/js/ajax-search.js\', array( \'jquery\' ) );
    wp_localize_script( \'mi-script-ajax\', \'MyAjax\', array( \'url\' => admin_url( \'admin-ajax.php\' ) ) );
}


function llamadaAjax_callback() {
    $pageId = 0;
    $newSlug = \'\';
    $reviewSlug = \'\';
    $sPostType = \'any\';
    $sTemplatePart = \'\';
    $sTaxonomy= false;

    //Busqueda
    if( isset(  $_POST[\'search\'] ) ) {
        $sTemplatePart = \'search-ajax\';
        $sPostType = \'any\';
    }
    //Links
    elseif( isset(  $_POST[\'href\'] ) ) {
        $pageId = preg_match( \'/^http:\\/\\/.+\\/\\?page_id=\\d+$/\', $_POST[\'href\'] ) ? substr( strrchr( $_POST[\'href\'], \'=\' ), 1 ) : \'no-page\' ;
        if( $pageId === \'no-page\' && preg_match( \'/^http:\\/\\/.+\\/\\?(news|reviews|entrevistas|radio_shows|podcasts|cat|tag)=[a-zA-Z0-9\\-]+$/\', $_POST[\'href\'] ) ) {
            $newSlug = substr( strrchr( $_POST[\'href\'], \'=\' ), 1 );
        } elseif( $pageId === \'no-page\' && preg_match( \'/^http:\\/\\/.+\\/\\?(artistas|sellos|generos)=[a-zA-Z0-9\\-]+$/\', $_POST[\'href\'] ) ) {
            $sTaxonomy = true;
        }
        //$pageName = get_page_template_slug( intval( $pageId ) );
        if( $pageId !== \'no-page\' ) {
            if( $pageId === \'8\' ) {
                $sPostType = \'any\';
                $sTemplatePart = \'home-ajax\';
            } elseif( $pageId === \'22\' ) { 
                $sPostType = \'reviews\';
                $sTemplatePart = \'reviews-rvw-ajax\';
            } elseif( $pageId === \'6\' ) {
                $sPostType = \'news\';
                $sTemplatePart = \'noticias-news-ajax\';
            } elseif( $pageId === \'109\' ) {
                $sPostType = \'entrevistas\';
                $sTemplatePart = \'entrevistas-ajax\';
            } elseif( $pageId === \'112\' ) {
                $sPostType = \'radio-shows\';
                $sTemplatePart = \'radio-shows-ajax\';
            } elseif( $pageId === \'412\' ) {
                $sTemplatePart = \'podcasts-ajax\';
            } elseif( $pageId === \'415\' ) {
                $sTemplatePart = \'contacto-ajax\';
            }

        } elseif( $sTaxonomy === true ) {
            $sTemplatePart = \'reviews-rvw-ajax\';
            $sPostType = \'reviews\'; 
        } elseif( $newSlug !== \'\' ) {
            $sTemplatePart = \'single-ajax\';
            $sPostType = \'any\';
            if( preg_match( \'/^http:\\/\\/.+\\/\\?cat=\\d+$/\', $_POST[\'href\'] ) ) {
                 $sTemplatePart = \'category-ajax\';  
                 $sPostType = \'category\';       
            } elseif( preg_match( \'/^http:\\/\\/.+\\/\\?tag=[A-Za-z0-9\\-]+$/\', $_POST[\'href\'] ) ) {
                 $sTemplatePart = \'tags-ajax\';  
                 $sPostType = \'tag\';        
            }

            //get_template_part( \'single-ajax\' );
        }

    //Siguiente y Anterior
    } elseif( isset( $_POST[\'cadenaAll\'] ) && ( isset( $_POST[\'cadenaPrev\'] ) || isset( $_POST[\'cadenaNext\'] ) ) ) {
        if( isset(  $_POST[\'pageName\'] ) ) {
            if( $_POST[\'pageName\'] === \'reviews\' ) {
                $sPostType = \'reviews\';
                $sTemplatePart = \'next_reviews-rvw-ajax\';
            }
            elseif( $_POST[\'pageName\'] === \'news\' ) {
                $sPostType = \'news\';
                $sTemplatePart = \'next_noticias-news-ajax\';
            }
            elseif( $_POST[\'pageName\'] === \'entrevistas\' ) {
                $sPostType = \'entrevistas\';
                $sTemplatePart = \'next_entrevistas-ajax\';
            }
            elseif( $_POST[\'pageName\'] === \'radio-shows\' ) {
                $sPostType = \'radio-shows\';
                $sTemplatePart = \'next_radio-shows-ajax\';
            }
            elseif( $_POST[\'pageName\'] === \'podcasts\' ) {
                $sPostType = \'podcasts\';
                $sTemplatePart = \'next_podcasts-ajax\';
            }
            elseif( $_POST[\'pageName\'] === \'categories\' ) {
                $sPostType = \'category\';
                $sTemplatePart = \'next_categories-ajax\';
            }
            elseif( $_POST[\'pageName\'] === \'tags\' ) {
                $sPostType = \'tag\';
                $sTemplatePart = \'next_tags-ajax\';
            }
            elseif( $_POST[\'pageName\'] === \'search\' ) {
                $sPostType = \'any\';
                $sTemplatePart = \'next_search-ajax\';
            }
        }
    }


    //Submenu
    echo \'<div id="submenu"><ul>\';
    if( $sPostType !== \'\' ) {
        if( $sPostType == \'any\' || $sPostType == \'category\' || $sPostType == \'tag\' ) {
            $allCategories = get_categories();
            foreach( $allCategories as $cat ) {
                echo \'<li class="type-category"><a href="\' . get_category_link( $cat->cat_ID ) . \'">\' . $cat->name . \'</a></li>\'; 
            }
        } else {

            global $wpdb;
            // set the target relationship here
            $post_type = $sPostType;
            $taxonomy = \'category\';

            $terms_ids = $wpdb->get_col( $wpdb->prepare( "
                SELECT
                    tt.term_id
                FROM
                    {$wpdb->term_relationships} tr,
                    {$wpdb->term_taxonomy} tt,
                    {$wpdb->posts} p
                WHERE 1=1
                    AND tr.object_id = p.id
                    AND p.post_type = \'%s\'
                    AND p.post_status = \'publish\'
                    AND tr.term_taxonomy_id = tt.term_taxonomy_id
                    AND tt.taxonomy =\'%s\'
                ", $post_type, $taxonomy ) );

            $terms = get_terms( $taxonomy, array(
                \'include\' => $terms_ids,
                \'orderby\' => \'name\',
                \'order\' => \'ASC\'
            ) );


             //$aTypeCategories = get_categories( array( \'post_type\' => $type, \'number\' => \'10\'  ) );
             foreach( $terms as $cat ) {
                echo \'<li class="type-category"><a href="\' . get_category_link( $cat->term_id ) . \'">\' . $cat->name . \'</a></li>\'; 
             }
        }
    } else {
        echo \'<li class="type-category" style="color: transparent">Sin categorías</li>\'; 
    }
    echo \'</ul></div>\';
    if( $sTemplatePart ) get_template_part($sTemplatePart);
}

add_action( \'wp_enqueue_scripts\', \'theme_name_scripts\' );
add_action(\'wp_ajax_llamadaAjax\', \'llamadaAjax_callback\');
add_action(\'wp_ajax_nopriv_llamadaAjax\', \'llamadaAjax_callback\');
/js/ajax-search.js 文件:

jQuery(document).ready(function($) {

    var linksPages = $(\'.menu-menu-container a\');

    linksPages.on(\'click\',function(e){
                e.preventDefault();
                $(\'#content\').addClass(\'cortinaOut\');
                if( !$(this).attr(\'href\').match(/=8$/) ) {
                    $(\'#slider\').fadeOut(800);
                }
                jQuery.post(MyAjax.url, {action : \'llamadaAjax\' ,href : $(this).attr(\'href\') }, function(response) {
                setTimeout(function() {
                    $(\'#content\').html(response).fadeIn();
                    $(\'#content\').removeClass(\'cortinaOut\');
                }, 500);
            });
    });
});
从两天前开始,我就一直在努力找出问题所在。你知道怎么解决吗?

2 个回复
最合适的回答,由SO网友:Tom J Nowell 整理而成

javascript严重依赖内联属性进行事件处理,而不是基于jQuery的事件处理,并且您正在对不同的域进行AJAX调用,而不是当前所在的域

enter image description here

SO网友:bosco

这里存在许多问题。

首先,您发布的第一个代码块似乎存在于functions.php 文件或其他主题文件。如果这是真的,我敦促您考虑WordPress的加载例程——主题与AJAX请求完全无关,因此WordPress在处理AJAX请求时不会自动接触任何主题文件。我的意思是,如果该代码确实位于主题文件中,那么ajax_callback() WordPress在处理AJAX请求时无法使用该函数。

下一个问题是ajax_callback() 似乎从未注册为AJAX处理程序。为此,需要使用前缀为的自定义操作注册函数wp_ajax_ 和/或wp_ajax_nopriv as described in the Codex, 具有完整的动作格式wp_ajax_{custom action name} 和/或wp_ajax_nopriv_{custom action name}. 这样做看起来类似于以下内容(如果插件类中不存在):

function ajax_callback() {
  ...
}

add_action( \'wp_ajax_my_custom_action\', \'ajax_callback\' );        // For registered users
add_action( \'wp_ajax_nopriv_my_custom_action\', \'ajax_callback\' ); // For unregistered users
如果此代码不在插件类或PHP命名空间中,则highly 建议您使用比ajax_callback 以消除命名冲突的可能性。

如果此代码is 在插件类或PHP命名空间中,的第二个参数add_action 需要修改以适合PHP callback format.

最后,在您发布的JavaScript中action 键设置为ajax. 这个键告诉WordPress要执行哪个已注册的AJAX处理程序。目前,JavaScript函数将调用WordPress来尝试执行注册到wp_ajax_ajax 行动如果您的AJAX回调确实注册到此操作,我建议您将其更改为wp_ajax_ajax 过于泛化,很有可能导致命名冲突(如果不是一般性混淆的话)。

这个action 键应设置为{custom action name} 上述行动的一部分。为了调用ajax_callback() 注册到的功能wp_ajax_my_custom_action/wp_ajax_nopriv_my_custom_action 如上所述action 输入AJAX请求的键应该是my_custom_action.

我建议您阅读Codex entry on AJAX in Plugins 为了更好地理解AJAX在WordPress中的工作原理。

结束

相关推荐

帮助进行AJAX前端评论审核

我正在为我管理的网站实现一个前端AJAX评论调节系统,但我很难让它正常工作。现在单击批准评论的链接会运行正确的php脚本,但会重新加载整个页面。所以它是可行的,但我希望在不重新加载整个页面的情况下使用ajax批准评论,但我缺乏javascript知识,这阻碍了我的工作。以下是代码(位于插件中):add_filter( \'comment_text\', \'p3_comment_moderation_buttons\' ); function p3_comment_moderation_butto