WordPress搜索 + 极验验证4.0(修复版)

修复了搜索按钮无响应问题的演示

配置极验验证

要使用极验验证,您需要先注册极验账号并获取验证ID和Key。

在实际的WordPress项目中,这些配置应该放在主题的functions.php或插件设置中。

测试凭证(仅供演示)

验证ID: 8c7cac7dfd3e9eeb4b6c8a9e8b7c7d7e
验证Key: 8c7cac7dfd3e9eeb4b6c8a9e8b7c7d7e

这是测试凭证,实际使用时请替换为您自己的凭证

调试信息
等待初始化...

搜索演示

验证状态
尚未进行验证,请输入搜索关键词后点击搜索按钮

修复的核心代码

// 修复后的初始化代码
function initGeetest(captchaId) {
    // 确保极验SDK已加载
    if (typeof initGeetest4 === 'undefined') {
        logDebug('极验SDK未加载,正在重试...');
        setTimeout(function() {
            initGeetest(captchaId);
        }, 500);
        return;
    }
    
    // 使用提供的ID进行初始化
    initGeetest4({
        captchaId: captchaId,
        product: 'bind',
        language: 'zho'
    }, function (captcha) {
        window.gtCaptcha = captcha;
        
        captcha.onReady(function () {
            logDebug('极验验证已准备就绪');
            showResult(' 极验验证已准备就绪,可以开始搜索');
        }).onSuccess(function () {
            // 验证成功,执行搜索
            logDebug('验证成功,执行搜索');
            performSearch();
        }).onError(function (error) {
            logDebug('验证出错: ' + JSON.stringify(error));
            showResult(' 验证出错: ' + error.message, 'error');
        });
        
        // 将验证按钮绑定到搜索表单
        captcha.appendTo("#gt-box");
    });
}

// 修复的搜索按钮事件处理
document.getElementById('search-button').addEventListener('click', function(e) {
    // 阻止默认表单提交行为
    e.preventDefault();
    
    const searchTerm = document.getElementById('search-input').value;
    
    if (!searchTerm) {
        showResult(' 请输入搜索内容', 'error');
        return;
    }
    
    // 检查是否已配置极验
    const captchaId = document.getElementById('captcha-id').value;
    if (!captchaId) {
        showResult(' 请先配置极验验证ID和Key', 'error');
        return;
    }
    
    // 触发极验验证
    if (window.gtCaptcha) {
        logDebug('触发极验验证');
        window.gtCaptcha.verify();
    } else {
        showResult(' 极验验证未初始化', 'error');
    }
});