为什么我的脚本不能使用复选框？

我想制作一个“游戏”，出于某种原因，如果我尝试获取复选框的checked，我的脚本将会翻转出来......有时会起作用，有时它会停止执行。我错过了一些错误吗？在loselife()函数定义为什么我的脚本不能使用复选框？

<html> 
<head> 
<title>Untitled Document</title> 
<script> 
var check = "showcheck"; 
var number = 1234; 
var lvl = 1; 
var oldlvl = 1; 
var multiplier = 10000; 
var start = 1; 

function exefunction() { 
    document.getElementById("boxv").focus(); 
    if (check == "showcheck") { 
     document.getElementById("message").innerHTML = "What was the number?"; 
     document.getElementById("num").style.display = "none"; 
     document.getElementById("box").style.display = "inline"; 
     document.getElementById("boxv").focus(); 
     check = "checknum"; 
    } 
    else if (check == "checknum") { 
     if (document.getElementById("boxv").value == number) { 
      document.getElementById("message").innerHTML = "CORRECT!"; 
      document.getElementById("boxv").style.color = "#00DD00"; 
      document.getElementById("boxv").value = number; 
      document.getElementById("level").innerHTML = "Level: " + lvl; 
      lvl++; 
     } 
     else if (document.getElementById("boxv").value != number) { 
      document.getElementById("message").innerHTML = "INCORRECT!"; 
      document.getElementById("boxv").style.color = "#DD0000"; 
      document.getElementById("boxv").value = number; 
      document.getElementById("level").innerHTML = "Level: " + lvl; 
      if (lvl>1) {lvl--;} 
      loselife(); 
     } 
     check = "showmem"; 
    } 
    else if (check == "showmem") { 
     if (lvl == oldlvl + 10) { 
      oldlvl = lvl; 
      multiplier = multiplier * 10; 
      document.getElementById("boxv").maxLength = multiplier.toString().length - 1; 
     } 
     else if (lvl < oldlvl) { 
      oldlvl = lvl - 10; 
      multiplier = multiplier/10; 
      document.getElementById("boxv").maxLength = multiplier.toString().length - 1; 
     } 
     number = Math.floor(Math.random() * multiplier/10 * 9) + multiplier/10; 
     document.getElementById("boxv").style.color = "#000000"; 
     document.getElementById("boxv").value = ""; 
     document.getElementById("message").innerHTML = "Memorize this number: "; 
     document.getElementById("num").innerHTML = number; 
     document.getElementById("num").style.display = "inline"; 
     document.getElementById("box").style.display = "none"; 
     check = "showcheck"; 
    } 
} 

function loselife(){ 
    var life = 4; 
    var hearts = "&#9829; "; 
    alert(document.getElementById("lifebox").checked); 
} 
function submitenter() { 
    var keycode = window.event.keyCode; 
    if (keycode == 13) { 
     if (start === 0) {exefunction();} 
     else {startfunc();} 
    } 
    if (keycode < 47 || keycode > 58) { 
     return false; 
    } 
} 

function startfunc() { 
    document.getElementById("button").innerHTML = '<input name="" type="button" value="OK" onClick="exefunction()"/>'; 
    document.getElementById("level").innerHTML = "Level: " + lvl; 
    document.getElementById("message").innerHTML = "Memorize this number: "; 
    document.getElementById("num").style.display = "inline"; 
    document.getElementById("boxv").value = ""; 
    document.getElementById("box").style.display = "none"; 
    if (document.getElementById("lifecheck").checked === true) { 
     document.getElementById("life").innerHTML = "&#9829; &#9829; &#9829; &#9829; &#9829; "; 
    } 
    else if (document.getElementById("lifecheck").checked === false) { 
     document.getElementById("life").innerHTML = ""; 
    } 
    if (document.getElementById("timercheck").checked === true) { 
     document.getElementById("timer").innerHTML = "3:00"; 
    } 
    else if (document.getElementById("timercheck").checked === false) { 
     document.getElementById("timer").innerHTML = ""; 
    } 
    start = 0; 
} 

function tests() { 
    alert(lfckv); 
} 
</script> 
<style type="text/css"> 
#level, #life, #timer{ 
    color: #666; 
} 
* { 
    text-align: center; 
} 
#num { 
    display: none; 
} 
#num { 
    font-size: x-large; 
} 
#body { 
    margin-top: 250px; 
    margin-right: auto; 
    margin-bottom: 100px; 
    margin-left: auto; 
} 
body { 
    background-color: #6FF; 
} 
</style></head> 
<body onKeyPress="return submitenter()" > 
<div id="body"> 
<span id="level"></span> 
<table align="center"> 
    <tr> 
    <td width="200" height="50" align="center" valign="middle"><span id="message">What level would you like to begin at?</span></td> 
    <td width="200" height="50" align="center" valign="middle"><span id="num">1234</span><span id="box"><input type="text" id="boxv" maxlength="4" value="1"/></span></td> 
    </tr> 
</table> 
<table align="center"> 
    <tr> 
    <td width="200" id="life"><label><input id="lifecheck" type="checkbox" >Lives</label></td> 
    <td id="button"><input type="button" value="OK" onClick="startfunc()"/></td> 
    <td width="200" id="timer"><label><input id="timercheck" type="checkbox" >Timer</label></td> 
    </tr> 
</table> 
<input name="" type="button" onClick="tests()" value="tests()"> 
</div> 
</body> 
</html>

来源

2011-01-21 Sean

在JavaScript控制台中的任何东西？ “翻转”不完全是一个有用的诊断。 – 2011-01-21 04:01:50

AHAH！我解决了这个问题。显然，当我将复选框的可见性设置为none时，由于某种原因它也将checkvalue设置为null。我曾预料它会保持checkvalue，但由于某种原因，它没有。

来源

2011-01-21 06:27:49 Sean

lifebox

未启用。另外，还请检查test()函数，即alert()语句有一个未定义的变量。

如果您使用Google chrome（或任何其他可帮助您调试的浏览器），我会建议您通过您的代码行进行调试。

来源

2011-01-21 04:03:54 SuperSaiyan

在铬，我得到的是“未捕获TypeError：无法读取属性'检查'null” – Sean 2011-01-21 05:37:39

我认为你最好使用简单的等式来检查你的复选框的状态，因为我很漂亮，结果不是布尔值。

因此，这将是类似的东西：

if (document.getElementById("lifecheck").checked == true) {

或者干脆

if (document.getElementById("lifecheck").checked) {

，而不是

if (document.getElementById("lifecheck").checked === true) {

来源

2011-01-21 06:11:53 Sheavi

为什么我的脚本不能使用复选框？

回答

相关问题