javascript - 下面给出的代码中的我的 javascript 函数被调用两次

标签 javascript html function invocation

下面的代码是一个简单的猜数字游戏。 函数 guess() 被调用两次。我完全不明白为什么会发生这种情况。

<!DOCTYPTE html>

<html>
    <head><title>Number Guessing Game version 1.0</title></head>
    <body>
        <form onsubmit="guess();return false;">
        <p><h2>I am your host, human.  I am thinking of a number between 0 and 100, including both</h2></p>
        <p><input type="text" id="inputId" autocomplete="off"></input><button id="submitButton" onclick="guess()">Guess!!</button></p>
        <p><span id="msgId"></span></p>
        <p>Guesses Remaining:<span id="guessId"></span></p>
    </body>
    </form>
    <script language="javascript">
        var doubleRandom = Math.random();
        var guessesLeft = parseInt("10");
        var intRandom = Math.round((doubleRandom*100));
        var spanObj = document.getElementById("msgId");
        var guessObj = document.getElementById("guessId");
        guessObj.innerHTML=guessesLeft;
        function guess()
        {
            var guessedNumber = document.getElementById("inputId").value;
            alert(23);
            if(guessedNumber==null || guessedNumber.trim()==''){
                spanObj.innerHTML="Type something, human";
                return;
            }
            if(isNaN(guessedNumber)){
                spanObj.innerHTML="That better be a number, Human.";
                return;
            }else{
                if(guessedNumber>100){
                    spanObj.innerHTML="That better be a number between 0 and 100, Human.";
                    return;
                }else{
                    spanObj.innerHTML="";
                }
            }
            var accurateAnswer = Math.round(guessedNumber);
            var difference = guessedNumber-intRandom;
            if(difference>45){
                spanObj.innerHTML="That's way too high, Human";
                return;
            }else if(difference<-45){
                spanObj.innerHTML="That's way too low, Human";
            }else if(difference<=45 && difference>0){
                spanObj.innerHTML="That's high, Human";
            }else if(difference>=-45 && difference<0 ){
                spanObj.innerHTML="That's low, Human";
            }else{
                spanObj.innerHTML="Bingo!! You got it!!  Refresh to play agin.";
            }
            if(guessesLeft<=0){
                spanObj.innerHTML="You have exhausted your number of guesses.  Try again.  Refreshing game....";
                setTimeout("location.reload(true)", 3000);
            }
            guessesLeft=guessesLeft-1;
            guessObj.innerHTML=guessesLeft;
        }
    </script>
</html>

最佳答案

这是因为您调用了它两次:一次在按钮的 onclick 事件中,一次在表单的 onsubmit 事件中。删除其中之一。

关于javascript - 下面给出的代码中的我的 javascript 函数被调用两次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17774515/

相关文章:

javascript - 有没有办法断言在 Cypress 中没有调用路由?

jquery - 如何只显示当前所选选项的图标?

HTML 包装器 Div 标签不起作用?

javascript - jquery .data 函数与在 html 中设置数据值

从多个表返回所有列的函数 (PostgreSQL)

javascript - 处理用户上传图片时防止 'content-sniffing'类型漏洞?

javascript - JavaScript 浏览器端框架/解决方案架构的组件是什么?

javascript - Select2 以 Vue Js 作为指令

javascript - 如何通过使用 jquery 选择选项来显示和隐藏表单

c 编程语言 - declare() 函数