使用form.submit()等方式提交表单时onclick函数无法触发如何解决？

问题根因 #

你尝试触发点击/提交失败的核心原因是事件绑定时机不匹配：
contact_form_2.js 的执行逻辑是：

1. window.load 触发时先隐藏提交按钮，异步加载reCAPTCHA脚本
2. 等reCAPTCHA脚本加载完成后，才会给提交按钮绑定onclick回调，同时把按钮改为显示状态
   而你的myscript.js同样在window.load触发时立即执行提交逻辑，这时候reCAPTCHA脚本还没加载完成，按钮上根本还没绑定onclick回调，自然所有触发操作都不会生效。

解决方案 #

你只需要等待按钮的onclick回调绑定完成后再触发提交即可，以下是两种可直接使用的实现方案：

方案1：轮询检查（简单兼容，无需复杂API） #

修改你的myscript.js代码如下：

window.addEventListener("load", function() {
    const submitButton = document.querySelector('#basic-junk-form #submit');
    // 每100ms检查一次按钮是否就绪
    const checkInterval = setInterval(() => {
        // 两个判断条件：按钮已显示（reCAPTCHA加载完成）、onclick回调已绑定
        if (submitButton.style.display !== 'none' && typeof submitButton.onclick === 'function') {
            clearInterval(checkInterval);
            // 直接调用绑定好的onclick方法，比模拟点击更稳妥
            submitButton.onclick(new Event('click'));
        }
    }, 100);
    // 30秒超时兜底，避免无限轮询
    setTimeout(() => clearInterval(checkInterval), 30000);
});

方案2：MutationObserver监听（性能更优） #

如果不想用轮询，可以用DOM变动监听API实现：

window.addEventListener("load", function() {
    const submitButton = document.querySelector('#basic-junk-form #submit');
    // 监听按钮的style属性变动
    const observer = new MutationObserver((mutations) => {
        mutations.forEach(item => {
            if (item.attributeName === 'style' && submitButton.style.display !== 'none' && typeof submitButton.onclick === 'function') {
                observer.disconnect();
                submitButton.onclick(new Event('click'));
            }
        });
    });
    observer.observe(submitButton, { attributes: true });
    // 超时兜底
    setTimeout(() => observer.disconnect(), 30000);
});

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