【问题标题】：Wordpress ajax call returns entire html pageWordpress ajax 调用返回整个 html 页面
【发布时间】：2015-07-15 21:29:10
【问题描述】：

我正在将一个网络应用程序迁移到我的 wordpress 网站中。我想将应用程序放在一个 wordpress 页面上。当我在页面加载时使用 ajax 调用初始化内容时，我会收到整个页面的 html 字符串。

位于functions.php中的php代码

<?php 

function my_scripts_method() {

    if (is_page('testpage')) {
        wp_register_script(
            'ajaxexample',
            get_template_directory_uri() . '/js/ajaxexample.js',
            array('jquery')     );
        wp_enqueue_script('ajaxexample');
        wp_localize_script( 'ajaxexample', 'ajax_object', array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) ); 
    }
}
add_action('wp_enqueue_scripts', 'my_scripts_method');




    function example_ajax_request() {


        if ( isset($_REQUEST) ) {

            $fruit = $_REQUEST['fruit'];

            // Trivial action
            if ( $fruit == 'Banana' ) {
                $fruit = 'Apple';
            }


            // return this to js function
            echo $fruit;



        }

       die();
    }

    add_action( 'wp_ajax_example_ajax_request', 'example_ajax_request' );
    add_action( 'wp_ajax_nopriv_example_ajax_request', 'example_ajax_request' );

和javascript文件`ajaxexample.js`

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


    // We'll pass this variable to the PHP function example_ajax_request
    var fruit = 'Banana';

    // This does the ajax request
    $.ajax({
        url: ajax_object.ajaxurl,
        data: {
            'action':'nopriv_example_ajax_request',
            'fruit' : fruit
        },
        success:function(data) {
            // This outputs the result of the ajax request
            alert('data:'+data);
            console.log(data);
        },
        error: function(errorThrown){
            alert(errorThrown);
            console.log(errorThrown);
        }
    });  

});

当我加载“测试页”时，我的 ajax 返回类似于：

data:


<!DOCTYPE html>
<!--[if IE 7]>
<html class="ie ie7" lang="en-US">
<![endif]-->
<!--[if IE 8]>
<html class="ie ie8" lang="en-US">
<![endif]-->
<!--[if !(IE 7) | !(IE 8)  ]><!-->
<html lang="en-US">
<!--<![endif]-->
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <title>testpage | TITLE </title>
    <link rel="profile" href="http://gmpg.org/xfn/11">
    <link rel="pingback" href="MYSITEURL/xmlrpc.php">
    <!-- start favicon and apple icons -->
                            <!-- end favicons and apple icons -->
...

我的理解是ajax请求成功到达admin-ajax.php但我不理解返回，因为我希望wp文件将内容传递给我的example_ajax_request函数。如何让预期的 php 脚本正确处理我的 ajax 请求？

【问题讨论】：

是响应中的“水果”部分吗？
不是。返回字符串似乎在大约 10,000 个字符处被截断。最终内容看起来像jQuery.fn.tpessential.defaults.ajaxTypes.push({type:"revslider",func:ajaxRevslider,killfunc:ajaxRemoveRevslider,openAnimationSpeed:0.3}); // type: Name of the Post to load via Ajax into the Essential Grid Ajax Container // func: the Function Name which is Called once the Item with the Post Type has been clicked // killfunc: function to kill in case the Ajax Wi

标签： javascript php ajax wordpress

【解决方案1】：

从您的 ajax 函数中删除 no_priv

 $.ajax({
        url: ajax_object.ajaxurl,
        data: {
            'action':'example_ajax_request',
            'fruit' : fruit
        },
        success:function(data) {
            // This outputs the result of the ajax request
            alert('data:'+data);
            console.log(data);
        },
        error: function(errorThrown){
            alert(errorThrown);
            console.log(errorThrown);
        }
    });

【讨论】：

我认为没有 no_priv 前缀对于未登录的用户是行不通的，但我错了。当我进行此更改时，ajax 返回保持不变。谢谢。
我检查了网址。果然通向了myroot/wp-admin/admin-ajax.php
id 说直接在 url 字段中输入 url 以查看它是否有效，您描述的输出是 php 输出的页面，这是使用了错误的 url。我看到您正在使用本地化脚本添加 url？
哇。好的。硬编码它起作用了。现在调查原因...谢谢！
没有问题，它的问题本地化脚本调用太晚了，我不太熟悉它如何更改文件中的变量。

【解决方案2】：

你的网址不应该如下：

ajax_object.ajax_url

而不是：

ajax_object.ajaxurl

【讨论】：

对于任何偶然发现这个问题的人来说，这个答案都比公认的答案要好，因为上面的问题是来自他的本地化脚本的'ajax_url'...在 jQuery 中它写成ajaxurl

位于functions.php中的php代码

和javascript文件ajaxexample.js

和javascript文件`ajaxexample.js`