WordPress插件开发：AJAX获取自定义函数返回值却返回整页的解决方法

出现返回整页HTML、无控制台报错的核心原因是两处不符合WordPress AJAX开发规范的疏漏，和ajaxurl定义错误、钩子拼写错误这类会直接触发400报错的问题不同，这类疏漏不会抛出可见错误，只会静默返回不符合预期的内容：

• 后端回调函数写法错误：WordPress触发wp_ajax_*系列钩子时，仅会执行钩子挂载的函数，既不会自动捕获函数的return值并输出到响应流，也不会在钩子执行完成后自动终止脚本运行。你当前的ajax_say_hello函数仅通过return "hello"返回值，既没有把内容输出到响应通道，也没有阻断后续代码流程；函数执行完成后，程序会继续走完WordPress的正常渲染逻辑，输出主题模板的整页HTML作为AJAX响应内容。
• 前端提交逻辑缺失拦截：给表单绑定submit事件时，没有阻止表单的原生提交行为，特定场景下会触发原生POST跳转，同样返回整页HTML内容，不会产生前端报错。

• 修正后端回调函数逻辑：替换仅返回值的写法，主动输出响应内容，并在逻辑完成后强制终止脚本：

function ajax_say_hello(){
    // 主动输出要返回的字符串，不能依赖return的隐式输出
    echo "hello";
    // 必须执行终止逻辑，阻断后续WordPress模板的内容输出
    wp_die();
}

这里要注意：wp_die()是WordPress AJAX处理的强制要求步骤，缺失该逻辑必然会出现整页HTML返回的问题。

• 校验钩子注册的有效性：确保两个add_action钩子是在插件文件的全局作用域下直接执行，不要嵌套在其他初始化函数、激活钩子的闭包逻辑中，避免钩子未被成功注册到系统。
• 补全前端事件拦截逻辑：在submit事件回调开头加入原生行为拦截，避免表单触发默认跳转：

jQuery(document).ready(function($) {
    $('#myform').on('submit', function(e) {
        // 阻止表单默认提交行为
        e.preventDefault();
        var data = {
            action: 'ajax_say_hello',
        };

        jQuery.post(ajaxurl, data, function(response) {
            alert('Got this from the server: ' + response);
        });
    });
});

内容的提问来源于stack exchange，提问作者Mohsen35