WordPress博客中Facebook分享按钮点击无响应问题求助

核心问题：变量作用域错误 #

Facebook分享按钮无响应的主要原因是shareOnFacebook函数无法正确获取游戏结果数据：

• accuracy是endGame函数内的局部变量，外部函数访问不到
• 分享文案里的分数未包含时间奖励，且变量作用域限制导致无法读取正确数值

修复步骤 #

1. 在initGame函数开头添加全局变量，用于存储最终游戏结果：

let finalScore;
let finalAccuracy;

2. 在endGame函数计算完成后，将结果赋值给全局变量：

// 替换原有的分数和精度展示代码，新增赋值逻辑
finalScore = score + timeBonus;
finalAccuracy = accuracy;

3. 修改shareOnFacebook函数，修复变量读取问题并添加弹窗兼容处理：

function shareOnFacebook() {
    const shareText = `Ich habe gerade ${finalScore} Punkte mit einer Genauigkeit von ${finalAccuracy.toFixed(2)}% im US Bundesstaaten Quiz erzielt! Kannst du mich schlagen?`;
    const shareUrl = `https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(window.location.href)}&quote=${encodeURIComponent(shareText)}`;
    // 处理弹窗被拦截的情况
    const popup = window.open(shareUrl, '_blank', 'width=600,height=400');
    if (!popup) {
        alert('Bitte deaktiviere deinen Popup-Blocker, um zu teilen!');
    }
}

额外兼容处理（针对WordPress环境） #

WordPress主题或插件可能存在脚本冲突，导致直接绑定的按钮事件失效，改用事件委托替代：
在endGame函数里，替换原有的按钮事件绑定代码：

// 移除原有的document.getElementById('share-button').addEventListener代码
resultsDiv.addEventListener('click', function(e) {
    if (e.target.id === 'share-button') {
        shareOnFacebook();
    }
});

完整修复后的关键代码片段 #

function initGame() {
    // 新增全局变量存储最终结果
    let finalScore;
    let finalAccuracy;
    // ... 原有代码保持不变 ...

    function endGame() {
        stopTimer();
        const totalAttempts = correctFirstTry + correctSecondTry + correctThirdTry + (currentStateIndex - (correctFirstTry + correctSecondTry + correctThirdTry));
        const accuracy = ((correctFirstTry + correctSecondTry / 2 + correctThirdTry / 3) / totalAttempts) * 100;

        let timeBonus = 0;
        if (totalTime < 3 * 60 * 1000) {
            timeBonus = 100;
        }
        if (totalTime < 2 * 60 * 1000) {
            timeBonus = 250;
        }
        // 赋值给全局变量
        finalScore = score + timeBonus;
        finalAccuracy = accuracy;

        resultsDiv.innerHTML = `
            <p>Glückwunsch! Du hast das Quiz abgeschlossen.</p>
            <p>Dein Punktestand: ${finalScore}</p>
            <p>Genauigkeit: ${finalAccuracy.toFixed(2)}%</p>
            <p>Zeit: ${getFormattedTime(totalTime)}</p>
            <p>Zeitbonus: ${timeBonus} Punkte</p>
            <p>Hier ist eine Aufschlüsselung deiner Versuche:</p>
            <ul>
                <li>Richtig beim ersten Versuch: ${correctFirstTry}</li>
                <li>Richtig beim zweiten Versuch: ${correctSecondTry}</li>
                <li>Richtig beim dritten Versuch: ${correctThirdTry}</li>
            </ul>
            <button id="share-button">Teile deine Ergebnisse auf Facebook!</button>
        `;

        // 使用事件委托绑定点击事件
        resultsDiv.addEventListener('click', function(e) {
            if (e.target.id === 'share-button') {
                shareOnFacebook();
            }
        });
        startButton.style.display = 'block';
    }

    function shareOnFacebook() {
        const shareText = `Ich habe gerade ${finalScore} Punkte mit einer Genauigkeit von ${finalAccuracy.toFixed(2)}% im US Bundesstaaten Quiz erzielt! Kannst du mich schlagen?`;
        const shareUrl = `https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(window.location.href)}&quote=${encodeURIComponent(shareText)}`;
        const popup = window.open(shareUrl, '_blank', 'width=600,height=400');
        if (!popup) {
            alert('Bitte deaktiviere deinen Popup-Blocker, um zu teilen!');
        }
    }

    // ... 原有代码保持不变 ...
}

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