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

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

javascript

Javascript：函数未使用按钮onclick事件定义？,javascript,Javascript,学习JS，试图让这个小调查工作，但我在HTML元素onclick中遇到了一个“函数未定义”错误。不知道为什么，似乎函数已经定义，我找不到任何语法错误。我还收到一个错误，说“soda未定义”，但似乎该变量定义为数组中的对象 <html> <body> <h3>What cats are in the room?</h3> Sophie: <input type="checkbox" id="sophieCheck"> <br&g

学习JS，试图让这个小调查工作，但我在HTML元素onclick中遇到了一个“函数未定义”错误。不知道为什么，似乎函数已经定义，我找不到任何语法错误。我还收到一个错误，说“soda未定义”，但似乎该变量定义为数组中的对象

<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>


房间里有什么猫？
索菲：



苏打水：



先生。：



试试看




函数catsInTheRoom（）{
var myCats=[苏打水，先生，苏菲]；
如果（getElementById（“sodaCheck”）。选中）{
myCats[0]=1；
}否则{
myCats[0]=0；
}
if（getElementById（“sophieCheck”）.checked）{
myCats[2]=10；
}否则{
myCats[2]=0；
}
if（getElementById（“mrCheck”）.checked）{
myCats[1]=20；
}否则{
myCats[1]=0；
}
getElementById（“cats”）.innerHTML=myCats[0]+myCats[1]+myCats[2]；
}

我创建了数组，这样我就可以使用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>

苏菲：

苏打水：

先生。：

试试看

函数myFunction（）{ var soda=document.getElementById（“sodaCheck”）。已选中； if（苏打水）{ catBehavior=“猫是流氓。”； }否则{ catBehavior=“猫表现得很好。”； } document.getElementById（“cats”）.innerHTML=catBehavior； }

为什么第二个示例有效，而第一个示例无效？

脚本错误：soda、mr、sophie用作变量，但以前从未定义过。。抛出错误并停止函数执行

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

或者，您可以先定义变量：

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

bunt由于您在初始myCats定义之后从未使用过它们，因此初始化为0s应该足够了

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

标记是自动关闭的

苏打水，先生和苏菲一定是弦乐

getElementById

属于

文档

对象（或任何其他DOM节点）

房间里有什么猫？索菲：
苏打水：
先生。：
试试看

函数catsInTheRoom（）{ var myCats=[‘苏打’、‘先生’、‘苏菲’]； if（document.getElementById（“sodaCheck”）.checked）{ myCats[0]=1； }否则{ myCats[0]=0； } if（document.getElementById（“sophieCheck”）.checked）{ myCats[2]=10； }否则{ myCats[2]=0； } if（document.getElementById（“mrCheck”）.checked）{ myCats[1]=20； }否则{ myCats[1]=0； } document.getElementById（“cats”）.innerHTML=myCats[0]+myCats[1]+myCats[2]； }

行“var myCats=[soda，mr，sophie]；”是错误的原因。您正在使用字符串作为变量。如果必须使用这些字符串，则创建具有这些属性的对象，并按如下方式初始化值
  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;
}