WordPress插件jQuery AJAX跳转异常：URL及Action参数失效求助

核心问题分析 #

1. 未阻止表单默认提交行为
   你绑定了表单的submit事件，但没有阻止浏览器的默认表单提交动作。这会导致浏览器在触发AJAX请求的同时，直接按照默认规则提交表单，跳转到当前页面（admin.php），AJAX请求根本没机会正常完成。

2. AJAX请求的data参数格式错误
   代码中data: {action: 'add_bookingdb', form_data}的写法是ES6属性简写，最终生成的参数结构是{action: 'add_bookingdb', form_data: "name=xxx&phone=xxx"}，这不符合WordPress AJAX的参数要求——WordPress需要action和表单字段平级传递，而不是把表单数据嵌套在form_data键下。

修正后的代码 #

写法一：直接拼接表单数据与action参数 #

jQuery('#add_db').submit(function(e){
    // 必须先阻止表单默认提交
    e.preventDefault();
    
    var form_data = jQuery(this).serialize();
    // 把action参数拼接到表单数据后
    var request_data = form_data + '&action=add_bookingdb';
    
    jQuery.ajax({ 
        url: ajaxurl,
        data: request_data,
        type: 'post',
        success: function(data) {
            console.log(data); 
        }
    });
});

写法二：用数组形式合并参数 #

jQuery('#add_db').submit(function(e){
    e.preventDefault();
    
    // 将表单数据转为数组，再添加action参数
    var form_data = jQuery(this).serializeArray();
    form_data.push({name: 'action', value: 'add_bookingdb'});
    
    jQuery.ajax({ 
        url: ajaxurl,
        data: form_data,
        type: 'post',
        success: function(data) {
            console.log(data); 
        }
    });
});

额外说明 #

• 确保ajaxurl变量在前端已正确定义（你提到其他AJAX请求正常，这一步应该没问题）。
• 修正后，表单会通过AJAX请求ajaxurl（即admin-ajax.php），同时正确传递action=add_bookingdb和表单字段参数，不会再跳转到admin.php。

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