2017-03-05 61 views
0

当我按下任意按钮或在控制台中键入功能时(例如,如果按下Roll!按钮或在控制台中键入Roll()),我的代码返回“未定义”。我不认为HTML有什么关系,但它可能会,所以我把它放在这里是我的代码:为什么函数返回没有定义?

<!DOCTYPE html> 
<html> 
<head> 
<style> 
.dropbtn { 
    color: black; 
    padding: 4px; 
    font-size: 16px; 
    border: none; 
    cursor: pointer; 
    min-width: 160px; 
} 

.dropbtn:hover, .dropbtn:focus { 
    background-color: gray; 
} 

.dropdown { 
    position: relative; 
    display: inline-block; 
} 

.dropdown-content { 
    display: none; 
    position: absolute; 
    background-color: #ffffff; 
    min-width: 160px; 
    overflow: auto; 
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); 
    z-index: 1; 
} 

.dropdown-content a { 
    color: black; 
    padding: 12px 16px; 
    text-decoration: none; 
    display: block; 
} 

.dropdown a:hover {background-color: #f1f1f1} 

.show {display:block;} 
</style> 
</head> 
<body> 
<img id="Dice1" src="White.png"></img> 
<img id="Dice2" src="White.png"></img> 
<img id="Dice3" src="White.png"></img> 
<p></p> 
<div class="dropdown"> 
<button onclick="Dropdown()" class="dropbtn">Number of Dice</button> 
    <div id="myDropdown" class="dropdown-content"> 
    <button class="dropbtn" onclick="DiceNum(1)">1 Dice</button> 
    <button class="dropbtn" onclick="DiceNum(2)">2 Die</button> 
    <button class="dropbtn" onclick="DiceNum(3)">3 Die</button> 
    </div> 
</div> 
<p></p> 
<button class="dropbtn" onclick="Roll()">Roll!</button> 
<script> 
    var Dice = 1; 
    function Dropdown() { 
     document.getElementById("myDropdown").classList.toggle("show"); 
    } 
    var openDropdown 
    window.onclick = function(event) { 
     if (!event.target.matches(".dropbtn")) { 
      var dropdowns = document.getElementsByClassName("dropdown-content"); 
      var i; 
      for (i = 0; i < dropdowns.length; i += 1) { 
       openDropdown = dropdowns[i]; 
       if (openDropdown.classList.contains("show")) { 
        openDropdown.classList.remove("show"); 
       } 
      } 
     } 
    } 
    var randNum1 = Math.floor((Math.random() * 6) + 1); 
    var randNum2 = Math.floor((Math.random() * 6) + 1); 
    var randNum3 = Math.floor((Math.random() * 6) + 1); 
    function Roll() { 
     if(Dice===1) { 
      randNum1 = Math.floor((Math.random() * 6) + 1); 
      document.getElementById("Dice1").src = "Dice"+randNum1+".png"; 
      document.getElementById("Dice2").src = "White.png"; 
      document.getElementById("Dice3").src = "White.png"; 
     } else if(Dice===2) { 
      randNum1 = Math.floor((Math.random() * 6) + 1); 
      randNum2 = Math.floor((Math.random() * 6) + 1); 
      document.getElementById("Dice1").src = "Dice"+randNum1+".png"; 
      document.getElementById("Dice2").src = "Dice"+randNum2+".png"; 
      document.getElementById("Dice3").src = "White.png"; 
     } else if(Dice===3) { 
      randNum1 = Math.floor((Math.random() * 6) + 1); 
      randNum2 = Math.floor((Math.random() * 6) + 1); 
      randNum3 = Math.floor((Math.random() * 6) + 1); 
      document.getElementById("Dice1").src = "Dice"+randNum1+".png"; 
      document.getElementById("Dice2").src = "Dice"+randNum2+".png"; 
      document.getElementById("Dice3").src = "Dice"+randNum3+".png"; 
     } 
    } 

    var DiceNum = function (x) { 
    if(x===1) { 
      return var Dice = 1; 
     } else if(x===2) { 
      return var Dice = 2; 
     } else if(x===3) { 
      return var Dice = 3; 
     } 
    } 
</script> 
</body> 
</html> 
+0

将脚本放在头部分 – CaptainHere

+1

他为什么要这样做?在关闭正文标记之前使用脚本是最常见的做法。 –

回答

1

您不能return变量赋值。相反,这样做

var DiceNum = function(x) { 
    if (x === 1) { 
     Dice = 1; 
    } else if (x === 2) { 
     Dice = 2; 
    } else if (x === 3) { 
     Dice = 3; 
    } 
} 
0

。在你的DiceNum功能的错误:

var DiceNum = function (x) { 
    if(x===1) { 
    return var Dice = 1; 
    } else if(x===2) { 
    return var Dice = 2; 
    } else if(x===3) { 
    return var Dice = 3; 
    } 
} 

return var Dice = 1是不正确的语法在Javascript中,尝试将其更改为return Dice = 1(在其他地方也改变它)

我希望这可以帮助!

0

不能声明变量很多次你的函数应该是这样的:

var DiceNum = function (x) { 

if(x===1) { 
     return Dice = 1; 
    } else if(x===2) { 
     return Dice = 2; 
    } else if(x===3) { 
     return Dice = 3; 
    } 
} 
0

DiceNum()将返回“VAR骰子= 1”试用评论,看看它是否运行也 尝试定义作为var Roll = function(){...类似于DiceNum

相关问题