WordPress自定义文章类型：JS动态设置标题保存失效求助

问题原因 #

WordPress经典编辑器（非Gutenberg）的标题字段有内部状态监听机制，仅通过JS设置value属性不会触发WordPress识别标题修改的事件，导致保存时系统仍判定标题为空，生成"auto draft"自动草稿标题。

解决方案 #

方案1：改进前端JS，触发输入事件 #

设置标题值后，手动派发input事件，让WordPress感知标题变化：

const inputTitleElm = document.querySelector("[name='post_title']");
const eventDate = document.querySelector("[name='event_date']").value; // 替换为你的日期输入框选择器
inputTitleElm.value = `${eventDate} event`;

// 触发input事件同步WordPress内部状态
const inputEvent = new Event('input', { bubbles: true });
inputTitleElm.dispatchEvent(inputEvent);

方案2：后台PHP钩子（推荐，更可靠） #

通过WordPress的wp_insert_post_data钩子，在文章保存时强制从日期字段生成标题，彻底规避前端JS的不确定性：
打开主题的functions.php文件，添加以下代码（替换your_custom_post_type为你的自定义文章类型slug，event_date为日期输入框的name属性）：

add_filter('wp_insert_post_data', 'set_custom_event_title', 10, 2);
function set_custom_event_title($post_data, $post_array) {
    // 仅处理目标自定义文章类型
    if ($post_data['post_type'] !== 'your_custom_post_type') {
        return $post_data;
    }

    // 当标题为空或为自动草稿，且存在有效日期时设置标题
    if (!empty($_POST['event_date']) && (empty($post_data['post_title']) || $post_data['post_title'] === 'Auto Draft')) {
        // 格式化日期（根据你的日期输入格式调整，示例为YYYY-MM-DD转MM/DD/YYYY）
        $date_obj = DateTime::createFromFormat('Y-m-d', $_POST['event_date']);
        if ($date_obj) {
            $formatted_date = $date_obj->format('m/d/Y');
            $post_data['post_title'] = "{$formatted_date} event";
        }
    }

    return $post_data;
}

方案3：监听保存按钮，实时同步标题 #

监听发布/保存按钮的点击事件，在提交前再次设置标题并触发事件：

const publishBtn = document.querySelector('#publish');
publishBtn.addEventListener('click', function(e) {
    const inputTitleElm = document.querySelector("[name='post_title']");
    const eventDate = document.querySelector("[name='event_date']").value;
    inputTitleElm.value = `${eventDate} event`;
    
    const inputEvent = new Event('input', { bubbles: true });
    inputTitleElm.dispatchEvent(inputEvent);
});

总结 #

优先选择方案2的后台钩子方法，它不依赖前端JS的执行情况，能确保标题在保存时被正确设置，避免前端可能出现的加载顺序、事件触发失败等问题。

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