JavaScript 得分值没有增加

标签 javascript html

我正在用 HTML 和 JavaScript 编写一个小名称的图片游戏，当用户得到正确的答案时，我在增加分数值方面遇到了一些问题，分数值不会增加，所以当得到正确的答案时星星不会改变。到目前为止我已经提供了我的代码，任何帮助将不胜感激

<script language="javascript">
var Pics;
var Score = 0;

function btnStart_onClick() {
    document.getElementById("btnBS").disabled = false;
    document.getElementById("btnBW").disabled = false;
    document.getElementById("btnCP").disabled = false;
    document.getElementById("btnFP").disabled = false;
    document.getElementById("btnPH").disabled = false;
    document.getElementById("btnPW").disabled = false;
    document.getElementById("btnRD").disabled = false;
    document.getElementById("btnTP").disabled = false;
    document.getElementById("btnTS").disabled = false;
    document.getElementById("btnYH").disabled = false;
    document.getElementById("btnStart").disabled = true;
    document.getElementById("Ptxt").innerHTML = "What is the above symbol?"
    Pics = Math.floor(Math.random() * 10) + 1

    if (Pics == 0)
        "MapSym_blank.jpg"
    else if (Pics == 1)
        Picture.src = "MapSym_BS.jpg"
    else if (Pics == 2)
        Picture.src = "MapSym_BW.jpg"
    else if (Pics == 3)
        Picture.src = "MapSym_CP.jpg"
    else if (Pics == 4)
        Picture.src = "MapSym_FP.jpg"
    else if (Pics == 5)
        Picture.src = "MapSym_PH.jpg"
    else if (Pics == 6)
        Picture.src = "MapSym_PW.jpg"
    else if (Pics == 7)
        Picture.src = "MapSym_RD.jpg"
    else if (Pics == 8)
        Picture.src = "MapSym_TP.jpg"
    else if (Pics == 9)
        Picture.src = "MapSym_TS.jpg"
    else if (Pics == 10)
        Picture.src = "MapSym_YH.jpg"
}
function btnBS_onClick() {
    document.getElementById("btnBS").disabled = true;
    document.getElementById("btnBW").disabled = true;
    document.getElementById("btnCP").disabled = true;
    document.getElementById("btnFP").disabled = true;
    document.getElementById("btnPH").disabled = true;
    document.getElementById("btnPW").disabled = true;
    document.getElementById("btnRD").disabled = true;
    document.getElementById("btnTP").disabled = true;
    document.getElementById("btnTS").disabled = true;
    document.getElementById("btnYH").disabled = true;
    document.getElementById("btnStart").disabled = false;

    if (Pics == 1) {
        document.getElementById("Ptxt").innerHTML = "Congratulations"
        Score += 1
    }
    else document.getElementById("Ptxt").innerHTML = "Try Again"
}
    function btnBW_onClick() {
        document.getElementById("btnBS").disabled = true;
        document.getElementById("btnBW").disabled = true;
        document.getElementById("btnCP").disabled = true;
        document.getElementById("btnFP").disabled = true;
        document.getElementById("btnPH").disabled = true;
        document.getElementById("btnPW").disabled = true;
        document.getElementById("btnRD").disabled = true;
        document.getElementById("btnTP").disabled = true;
        document.getElementById("btnTS").disabled = true;
        document.getElementById("btnYH").disabled = true;
        document.getElementById("btnStart").disabled = false;

        if (Pics == 2) {
            document.getElementById("Ptxt").innerHTML = "Congratulations"
            Score += 1
        }
        else document.getElementById("Ptxt").innerHTML = "Try Again"
    }
    function btnCP_onClick() {
        document.getElementById("btnBS").disabled = true;
        document.getElementById("btnBW").disabled = true;
        document.getElementById("btnCP").disabled = true;
        document.getElementById("btnFP").disabled = true;
        document.getElementById("btnPH").disabled = true;
        document.getElementById("btnPW").disabled = true;
        document.getElementById("btnRD").disabled = true;
        document.getElementById("btnTP").disabled = true;
        document.getElementById("btnTS").disabled = true;
        document.getElementById("btnYH").disabled = true;
        document.getElementById("btnStart").disabled = false;

        if (Pics == 3) {
            document.getElementById("Ptxt").innerHTML = "Congratulations"
            Score += 1
        }
        else document.getElementById("Ptxt").innerHTML = "Try Again"
    }
    function btnFP_onClick() {
        document.getElementById("btnBS").disabled = true;
        document.getElementById("btnBW").disabled = true;
        document.getElementById("btnCP").disabled = true;
        document.getElementById("btnFP").disabled = true;
        document.getElementById("btnPH").disabled = true;
        document.getElementById("btnPW").disabled = true;
        document.getElementById("btnRD").disabled = true;
        document.getElementById("btnTP").disabled = true;
        document.getElementById("btnTS").disabled = true;
        document.getElementById("btnYH").disabled = true;
        document.getElementById("btnStart").disabled = false;

        if (Pics == 4) {
            document.getElementById("Ptxt").innerHTML = "Congratulations"
            Score += 1
        }
        else document.getElementById("Ptxt").innerHTML = "Try Again"
    }
    function btnPH_onClick() {
        document.getElementById("btnBS").disabled = true;
        document.getElementById("btnBW").disabled = true;
        document.getElementById("btnCP").disabled = true;
        document.getElementById("btnFP").disabled = true;
        document.getElementById("btnPH").disabled = true;
        document.getElementById("btnPW").disabled = true;
        document.getElementById("btnRD").disabled = true;
        document.getElementById("btnTP").disabled = true;
        document.getElementById("btnTS").disabled = true;
        document.getElementById("btnYH").disabled = true;
        document.getElementById("btnStart").disabled = false;

        if (Pics == 5) {
            document.getElementById("Ptxt").innerHTML = "Congratulations"
            Score += 1
        }
        else document.getElementById("Ptxt").innerHTML = "Try Again"
    }
    function btnPW_onClick() {
        document.getElementById("btnBS").disabled = true;
        document.getElementById("btnBW").disabled = true;
        document.getElementById("btnCP").disabled = true;
        document.getElementById("btnFP").disabled = true;
        document.getElementById("btnPH").disabled = true;
        document.getElementById("btnPW").disabled = true;
        document.getElementById("btnRD").disabled = true;
        document.getElementById("btnTP").disabled = true;
        document.getElementById("btnTS").disabled = true;
        document.getElementById("btnYH").disabled = true;
        document.getElementById("btnStart").disabled = false;

        if (Pics == 6) {
            document.getElementById("Ptxt").innerHTML = "Congratulations"
            Score += 1
        }
        else document.getElementById("Ptxt").innerHTML = "Try Again"
    }
    function btnRD_onClick() {
        document.getElementById("btnBS").disabled = true;
        document.getElementById("btnBW").disabled = true;
        document.getElementById("btnCP").disabled = true;
        document.getElementById("btnFP").disabled = true;
        document.getElementById("btnPH").disabled = true;
        document.getElementById("btnPW").disabled = true;
        document.getElementById("btnRD").disabled = true;
        document.getElementById("btnTP").disabled = true;
        document.getElementById("btnTS").disabled = true;
        document.getElementById("btnYH").disabled = true;
        document.getElementById("btnStart").disabled = false;

        if (Pics == 7) {
            document.getElementById("Ptxt").innerHTML = "Congratulations"
            Score += 1
        }
        else document.getElementById("Ptxt").innerHTML = "Try Again"
    }
    function btnTP_onClick() {
        document.getElementById("btnBS").disabled = true;
        document.getElementById("btnBW").disabled = true;
        document.getElementById("btnCP").disabled = true;
        document.getElementById("btnFP").disabled = true;
        document.getElementById("btnPH").disabled = true;
        document.getElementById("btnPW").disabled = true;
        document.getElementById("btnRD").disabled = true;
        document.getElementById("btnTP").disabled = true;
        document.getElementById("btnTS").disabled = true;
        document.getElementById("btnYH").disabled = true;
        document.getElementById("btnStart").disabled = false;

        if (Pics == 8) {
            document.getElementById("Ptxt").innerHTML = "Congratulations"
            Score += 1
        }
        else document.getElementById("Ptxt").innerHTML = "Try Again"
    }
    function btnTS_onClick() {
        document.getElementById("btnBS").disabled = true;
        document.getElementById("btnBW").disabled = true;
        document.getElementById("btnCP").disabled = true;
        document.getElementById("btnFP").disabled = true;
        document.getElementById("btnPH").disabled = true;
        document.getElementById("btnPW").disabled = true;
        document.getElementById("btnRD").disabled = true;
        document.getElementById("btnTP").disabled = true;
        document.getElementById("btnTS").disabled = true;
        document.getElementById("btnYH").disabled = true;
        document.getElementById("btnStart").disabled = false;

        if (Pics == 9) {
            document.getElementById("Ptxt").innerHTML = "Congratulations"
            Score += 1
        }
        else document.getElementById("Ptxt").innerHTML = "Try Again"
    }
    function btnYH_onClick() {
        document.getElementById("btnBS").disabled = true;
        document.getElementById("btnBW").disabled = true;
        document.getElementById("btnCP").disabled = true;
        document.getElementById("btnFP").disabled = true;
        document.getElementById("btnPH").disabled = true;
        document.getElementById("btnPW").disabled = true;
        document.getElementById("btnRD").disabled = true;
        document.getElementById("btnTP").disabled = true;
        document.getElementById("btnTS").disabled = true;
        document.getElementById("btnYH").disabled = true;
        document.getElementById("btnStart").disabled = false;

        if (Pics == 10) {
            document.getElementById("Ptxt").innerHTML = "Congratulations"
            Score += 1
        }
        else document.getElementById("Ptxt").innerHTML = "Try Again"
    }

    if (Score == 1) {
        SOff1.src = "StarOn.gif"
    }
    if (Score == 2) {
        SOff1.src = "StarOn.gif"
        SOff2.src = "StarOn.gif"
    }
    if (Score == 3) {
        SOff1.src = "StarOn.gif"
        SOff2.src = "StarOn.gif"
        Soff3.src = "StarOn.gif"
    }
    if (Score == 4) {
        SOff1.src = "StarOn.gif"
        SOff2.src = "StarOn.gif"
        Soff3.src = "StarOn.gif"
        Soff4.src = "StarOn.gif"
    }
    if (Score == 5) {
        SOff1.src = "StarOn.gif"
        SOff2.src = "StarOn.gif"
        Soff3.src = "StarOn.gif"
        Soff4.src = "StarOn.gif"
        Soff5.src = "StarOn.gif"
    }
</script>

最佳答案

你需要把这个:

    if (Score == 1) {
        SOff1.src = "StarOn.gif"
    }
    if (Score == 2) {
        SOff1.src = "StarOn.gif"
        SOff2.src = "StarOn.gif"
    }
    if (Score == 3) {
        SOff1.src = "StarOn.gif"
        SOff2.src = "StarOn.gif"
        Soff3.src = "StarOn.gif"
    }
    if (Score == 4) {
        SOff1.src = "StarOn.gif"
        SOff2.src = "StarOn.gif"
        Soff3.src = "StarOn.gif"
        Soff4.src = "StarOn.gif"
    }
    if (Score == 5) {
        SOff1.src = "StarOn.gif"
        SOff2.src = "StarOn.gif"
        Soff3.src = "StarOn.gif"
        Soff4.src = "StarOn.gif"
        Soff5.src = "StarOn.gif"
    }

进入它自己的函数并在所有点击事件的底部调用它

例如:

function btnYH_onClick() {
    document.getElementById("btnBS").disabled = true;
    document.getElementById("btnBW").disabled = true;
    document.getElementById("btnCP").disabled = true;
    document.getElementById("btnFP").disabled = true;
    document.getElementById("btnPH").disabled = true;
    document.getElementById("btnPW").disabled = true;
    document.getElementById("btnRD").disabled = true;
    document.getElementById("btnTP").disabled = true;
    document.getElementById("btnTS").disabled = true;
    document.getElementById("btnYH").disabled = true;
    document.getElementById("btnStart").disabled = false;

    if (Pics == 10) {
        document.getElementById("Ptxt").innerHTML = "Congratulations"
        Score += 1
    }
    else document.getElementById("Ptxt").innerHTML = "Try Again"

    setScore();
}


function setScore() {
        if (Score == 1) {
        SOff1.src = "StarOn.gif"
    }
    if (Score == 2) {
        SOff1.src = "StarOn.gif"
        SOff2.src = "StarOn.gif"
    }
    if (Score == 3) {
        SOff1.src = "StarOn.gif"
        SOff2.src = "StarOn.gif"
        Soff3.src = "StarOn.gif"
    }
    if (Score == 4) {
        SOff1.src = "StarOn.gif"
        SOff2.src = "StarOn.gif"
        Soff3.src = "StarOn.gif"
        Soff4.src = "StarOn.gif"
    }
    if (Score == 5) {
        SOff1.src = "StarOn.gif"
        SOff2.src = "StarOn.gif"
        Soff3.src = "StarOn.gif"
        Soff4.src = "StarOn.gif"
        Soff5.src = "StarOn.gif"
    }
}

关于JavaScript 得分值没有增加，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41022337/

上一篇：javascript - 使用 Promise.mapSeries 等待回调

下一篇：javascript - 为什么警报返回与 console.log 不同

相关文章：

javascript - 如何将事件绑定(bind)到 Tabbing Off 元素？

javascript - 使用 javascript/html 根据文本框值计算数据

javascript - 可视化到一个选择框

javascript - 将值从组件传递到父实例

javascript - 使用 JS 的简单用户名提示无法正常运行

javascript - 如何使用 Node 的某些选项运行 webpack

html - 内联移动 CSS 声明 - 编码电子通讯

javascript - 即使鼠标移出，也会触发两次 Mouseenter 事件

html - css问题使用百分比与内部元素组成相等的百分比

javascript - HTML5 视频在 javascript 中完全预加载

©2024 IT工具网  联系我们