Javascript：函数未定义按钮onclick事件？

学习JS，试图让这个小调查工作，但我会在HTML元素的“功能没有定义”错误的onclick。无法弄清楚原因，看起来功能已定义，我无法找到任何语法错误。我还得到一个错误，说“苏打水没有定义”，但它似乎是变量被定义为数组中的一个对象。Javascript：函数未定义按钮onclick事件？

<html> 
<body> 

<h3>What cats are in the room?</h3> 

Sophie: <input type="checkbox" id="sophieCheck"> 
<br></br> 
Soda: <input type="checkbox" id="sodaCheck"> 
<br></br> 
Mr.: <input type="checkbox" id="mrCheck"> 
<br></br> 

<button onclick="catsInTheRoom()">Try it</button> 
<br></br> 

<p id="cats"></p> 


<script> 
function catsInTheRoom() { 

    var myCats = [ soda, mr, sophie ]; 

    if (getElementById("sodaCheck").checked) { 
     myCats[0] = 1; 
    } else { 
     myCats[0] = 0; 
    } 
    if (getElementById("sophieCheck").checked) { 
     myCats[2] = 10; 
    } else { 
     myCats[2] = 0; 
    } 
    if (getElementById("mrCheck").checked) { 
     myCats[1] = 20; 
    } else { 
     myCats[1] = 0; 
    } 

    getElementById("cats").innerHTML = myCats[0] + myCats[1] + myCats[2]; 
} 

</script> 
</body> 
</html>

我创建了数组，因此我可以使用switch语句的数值来根据检查框的复选框生成不同的文本。

这个简单的版本的工作：

Sophie: <input type="checkbox" id="sohpieCheck"> 
<br></br> 
Soda: <input type="checkbox" id="sodaCheck"> 
<br></br> 
Mr.: <input type="checkbox" id="mrCheck"> 
<br></br> 

<button onclick="myFunction()">Try it</button> 

<p id="cats"></p> 

<script> 

function myFunction() { 
    var soda = document.getElementById("sodaCheck").checked; 

    if (soda) { 
     catBehavior = "Cats are being rascals."; 
    } else { 
     catBehavior = "Cats are behaving nicely."; 
    }  

    document.getElementById("cats").innerHTML = catBehavior; 
} 

</script>

为什么第二个例子中工作，但不是第一位？

来源

2017-11-18 pizza_pal

你的代码中有一些错误。请检查修复程序：

<br>标签自封闭。
苏打水，先生和先生必须是字符串。
getElementById属于document对象（或任何其他DOM节点）。

<h3>What cats are in the room?</h3> 
 

 
Sophie: <input type="checkbox" id="sophieCheck"> 
 
<br> 
 
Soda: <input type="checkbox" id="sodaCheck"> 
 
<br> 
 
Mr.: <input type="checkbox" id="mrCheck"> 
 
<br> 
 

 
<button onclick="catsInTheRoom()">Try it</button> 
 
<br> 
 

 
<p id="cats"></p> 
 
<script> 
 
function catsInTheRoom() { 
 

 
var myCats = [ 'soda', 'mr', 'sophie' ]; 
 

 
if (document.getElementById("sodaCheck").checked) { 
 
myCats[0] = 1; 
 
} else { 
 
myCats[0] = 0; 
 
} 
 
if (document.getElementById("sophieCheck").checked) { 
 
myCats[2] = 10; 
 
} else { 
 
myCats[2] = 0; 
 
} 
 
if (document.getElementById("mrCheck").checked) { 
 
myCats[1] = 20; 
 
} else { 
 
myCats[1] = 0; 
 
} 
 

 
document.getElementById("cats").innerHTML = myCats[0] + myCats[1] + myCats[2]; 
 
} 
 
</script>

来源

2017-11-18 01:08:44

脚本错误：苏打水，先生，苏菲被用作变量，但之前从未定义..抛出错误并停止功能执行。

var myCats = [ 0, 0, 0 ]; // will initialize myCats to 0,0,0

，或者你可以定义的变量第一：

var soda = 0, mr = 0, sophie = 0;

短打，因为你永远不使用它们最初myCats定义后，初始化为0应该足够

来源

2017-11-18 00:45:49 danchik

线 'VAR myCats = [苏打，MR，柔];'是错误的原因。您正在使用字符串作为变量。如果您必须使用这些字符串，则使用这些属性创建一个对象并按如下方式初始化值;

var myCats ={soda=0, mr=0, sophie=0}; 
if (getElementById("sodaCheck").checked) { 
    myCats.soda = 1; 
} else { 
    myCats.soda = 0; 
} 
if (getElementById("sophieCheck").checked) { 
    myCats.sophie= 10; 
} else { 
    myCats.sophie = 0; 
} 
if (getElementById("mrCheck").checked) { 
    myCats.mr = 20; 
} else { 
    myCats.mr = 0; 
} 

getElementById("cats").innerHTML = myCats.soda + myCats.mr + myCats.sophie; 
}

来源

2017-11-18 01:15:05

Javascript：函数未定义按钮onclick事件？

回答

相关问题