Javascript函數返回爲undefined

試圖創建一個簡單的岩石紙剪刀遊戲。但是，當我點擊submit我的CalcWinner();得到一個控制檯錯誤「函數未定義」。Javascript函數返回爲undefined

我敢肯定，我錯過了一些容易，任何建議將不勝感激！

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
\t <meta charset="UTF-8"> 
 
\t <title>Rock - Paper - Scissors</title> 
 
\t <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
 
</head> 
 
<body> 
 
<p>Click the button to pick rock, paper or scissors.</p> 
 

 
<input type = "text" id = "picker" /> 
 
<button onclick="calcWinner();">Make your Selection?</button> 
 

 
<!-- <input type = "submit" value="Make your Selection"/> --> 
 
<p id="demo"></p> 
 
<p id="score"></p> 
 

 
<script> 
 
$(document).ready(function(){ 
 

 
var myChoice = ""; 
 
var compChoice = ""; 
 
var myScore = 0; 
 
var compScore = 0; 
 
    
 
    
 
    function calcWinner() { 
 
    myChoice = document.getElementById("picker");  
 
    compChoice = Math.random(); 
 
    if (compChoice < 0.33) { 
 
     compChoice = "rock"; 
 
    } else if(compChoice < 0.67) { 
 
     compChoice = "paper"; 
 
    } else { 
 
     compChoice = "scissors"; 
 
    } 
 
    
 
    if (compChoice == myChoice) { 
 
     document.getElementById("demo").innerHTML = "It's a tie! You picked " + myChoice + " and the computer picked " + compChoice; 
 
    } else if (compChoice == "rock") { 
 
     if(myChoice == "scissors") { 
 
     \t compScore ++; \t 
 
      document.getElementById("demo").innerHTML = "You lose! You picked " + myChoice + " and the computer picked " + compChoice; 
 
      
 
     } else if (myChoice == "paper") { 
 
      userScore ++; 
 
      document.getElementById("demo").innerHTML = "You win! You picked " + myChoice + " and the computer picked " + compChoice; 
 
     } else if (myChoice == "paper") { 
 
     } 
 
    } else if (compChoice == "paper") { 
 
     if (myChoice == "rock") { 
 
     \t compScore ++; \t 
 
      document.getElementById("demo").innerHTML = "You lose! You picked " + myChoice + " and the computer picked " + compChoice; 
 
     } else if (myChoice == "paper") { 
 
     } else if (myChoice == "scissors") { 
 
     \t userScore ++; 
 
     document.getElementById("demo").innerHTML = "You win! You picked " + myChoice + " and the computer picked " + compChoice; 
 
     } else if (myChoice == "paper") { 
 
     } 
 
    } else if (compChoice == "scissors") { 
 
     if (myChoice == "rock") { 
 
     \t userScore ++; 
 
      document.getElementById("demo").innerHTML = "You win! You picked " + myChoice + " and the computer picked " + compChoice + " you have " + userScore; 
 
     } else if (myChoice == "paper") { 
 
     } else if (myChoice == "paper") { 
 
     \t compScore ++; \t 
 
      document.getElementById("demo").innerHTML = "You lose! You picked " + myChoice + " and the computer picked " + compChoice; 
 
     } else if (myChoice == "paper") { 
 
     } 
 

 
    } 
 
}; 
 
    
 

 

 

 

 

 

 
}); 
 
</script>

來源

2015-10-14 krinse

不要將'calcWinner'方法包裝在ready函數中。 –

將'calcWinner'移出'ready'，它將是_private_並且不能從外部訪問 – Tushar

問題是calcWinner是封閉範圍內創建的，所以它不是從全球範圍訪問。

由於您使用jQuery，而不是使用內聯事件處理程序使用jQuery來註冊DOM準備處理程序中單擊處理類似下面

你也需要讀取輸入字段的值，以便myChoice = document.getElementById("picker").value;或myChoice = $("#picker").val()

$(document).ready(function() { 
 

 
    var myChoice = ""; 
 
    var compChoice = ""; 
 
    var myScore = 0; 
 
    var compScore = 0; 
 

 

 
    $('#selection').click(calcWinner); 
 
    
 
    function calcWinner() { 
 
    myChoice = document.getElementById("picker").value; 
 
    compChoice = Math.random(); 
 
    if (compChoice < 0.33) { 
 
     compChoice = "rock"; 
 
    } else if (compChoice < 0.67) { 
 
     compChoice = "paper"; 
 
    } else { 
 
     compChoice = "scissors"; 
 
    } 
 

 
    $("#demo").html(""); 
 
    if (compChoice == myChoice) { 
 
     $("#demo").html("It's a tie! You picked " + myChoice + " and the computer picked " + compChoice); 
 
    } else if (compChoice == "rock") { 
 
     if (myChoice == "scissors") { 
 
     compScore++; 
 
     $("#demo").html("You lose! You picked " + myChoice + " and the computer picked " + compChoice); 
 

 
     } else if (myChoice == "paper") { 
 
     userScore++; 
 
     $("#demo").html("You win! You picked " + myChoice + " and the computer picked " + compChoice); 
 
     } else if (myChoice == "paper") {} 
 
    } else if (compChoice == "paper") { 
 
     if (myChoice == "rock") { 
 
     compScore++; 
 
     $("#demo").html("You lose! You picked " + myChoice + " and the computer picked " + compChoice); 
 
     } else if (myChoice == "paper") {} else if (myChoice == "scissors") { 
 
     userScore++; 
 
     $("#demo").html("You win! You picked " + myChoice + " and the computer picked " + compChoice); 
 
     } else if (myChoice == "paper") {} 
 
    } else if (compChoice == "scissors") { 
 
     if (myChoice == "rock") { 
 
     userScore++; 
 
     $("#demo").html("You win! You picked " + myChoice + " and the computer picked " + compChoice + " you have " + userScore); 
 
     } else if (myChoice == "paper") {} else if (myChoice == "paper") { 
 
     compScore++; 
 
     $("#demo").html("You lose! You picked " + myChoice + " and the computer picked " + compChoice); 
 
     } else if (myChoice == "paper") {} 
 

 
    } 
 
    }; 
 
});

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
 
<p>Click the button to pick rock, paper or scissors.</p> 
 

 
<input type="text" id="picker" /> 
 
<button id= "selection">Make your Selection?</button> 
 

 
<!-- <input type = "submit" value="Make your Selection"/> --> 
 
<p id="demo"></p> 
 
<p id="score"></p>

來源

2015-10-14 03:25:22

你的CAL冠軍功能是jQuery的閉合功能裏面。窗口對象無法訪問它。你可以將它移動到ready函數之外，或者使用jQuery（'button'）。on（'click'，calcwinner）;

來源

2015-10-14 03:26:59

您應該將calcWinner移到global.Because它是專用的ready函數。窗口無法訪問它。

來源

2015-10-14 04:35:26

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Rock - Paper - Scissors</title> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
<script> 
// $(document).ready(function(){ 
$(function() { 
var myChoice = ""; 
var compChoice = ""; 
var myScore = 0; 
var compScore = 0; 
var userScore =0 ; 


    $("#selection").click(function(){ 

    myChoice = $("#picker").val();  
    compChoice = Math.random(); 
    if (compChoice < 0.33) { 
     compChoice = "rock"; 
    } else if(compChoice < 0.67) { 
     compChoice = "paper"; 
    } else { 
     compChoice = "scissors"; 
    } 



    if (compChoice == myChoice) { 
     document.getElementById("demo").innerHTML = "It's a tie! You picked " + myChoice + " and the computer picked " + compChoice; 
    } else if (compChoice == "rock") { 
     if(myChoice == "scissors") { 
      compScore ++; 
      document.getElementById("demo").innerHTML = "You lose! You picked " + myChoice + " and the computer picked " + compChoice; 

     } else if (myChoice == "paper") { 
      userScore ++; 
      document.getElementById("demo").innerHTML = "You win! You picked " + myChoice + " and the computer picked " + compChoice; 
     } else if (myChoice == "paper") { 
     } 
    } else if (compChoice == "paper") { 
     if (myChoice == "rock") { 
      compScore ++; 
      document.getElementById("demo").innerHTML = "You lose! You picked " + myChoice + " and the computer picked " + compChoice; 
     } else if (myChoice == "paper") { 
     } else if (myChoice == "scissors") { 
     userScore ++; 
     document.getElementById("demo").innerHTML = "You win! You picked " + myChoice + " and the computer picked " + compChoice; 
     } else if (myChoice == "paper") { 
     } 
    } else if (compChoice == "scissors") { 
     if (myChoice == "rock") { 
     userScore ++; 
      document.getElementById("demo").innerHTML = "You win! You picked " + myChoice + " and the computer picked " + compChoice + " you have " + userScore; 
     } else if (myChoice == "paper") { 
     } else if (myChoice == "paper") { 
      compScore ++; 
      document.getElementById("demo").innerHTML = "You lose! You picked " + myChoice + " and the computer picked " + compChoice; 
     } else if (myChoice == "paper") { 
     } 

    } 
}); 
    }); 
// }); 
</script> 


</head> 
<body> 
<p>Click the button to pick rock, paper or scissors.</p> 

<input type = "text" id = "picker" /> 
<button id="selection">Make your Selection?</button> 

<!-- <input type = "submit" value="Make your Selection"/> --> 
<p id="demo"></p> 
<p id="score"></p> 
</body> 
</html>

來源

2015-10-14 05:32:23

Javascript函數返回爲undefined

回答

相關問題