【发布时间】：2017-11-12 17:36:43
【问题描述】：
目标是在 3*3 的网格中创建 9 个按钮，并将两个单词作为两个输出输出。我尝试使用事件侦听器方法，但似乎无法弄清楚为什么它不起作用。有人可以给我一些指示吗？使用警报不是正确的选择。我很确定我的功能是问题所在。是否可以创建单击每个按钮后弹出的文本框？
<html>
<head>
<title> Device Control</title>
</head>
<body>
<table>
<tr>
<th> <button id="myBtn1">Try it </button> </th>
<th> <button id="myBtn2">Be Careful </button> </th>
<th> <button id="myBtn3"> Look AHEAD </button> </th>
</tr>
<tr>
<tH> <button id="myBtn4"> behind you</button> </th>
<th> <button id="myBtn5"> AHHHHHA</button> </th>
<th> <button id="myBtn6"> Bloooooddd</button> </th>
</tr>
<tr>
<th> <button id="myBtn7"> I am deeeaaaddddd </button> </th>
<th> <button id="myBtn8"> NOOOOOO </button> </th>
<th> <button id="myBtn9"> THE LIGHT</button> </th>
<tr>
</table>
<script>
document.getElementById("myBtn1").addEventListener("click", myFunction1);
function myFunction1() {
alert ("left"
"up");
}
document.getElementById("myBtn2").addEventListener("click", myFunction22);
function myFunction2() {
alert ("off"
"up");
}
document.getElementById("myBtn3").addEventListener("click", myFunction3);
function myFunction3() {
alert ("right");
}
document.getElementById("myBtn4").addEventListener("click", myFunction4;
function myFunction4() {
alert ("left"
"off");
}
document.getElementById("myBtn5").addEventListener("click", myFunction5);
function myFunction5() {
alert ("off"
"off");
}
document.getElementById("myBtn6").addEventListener("click", myFunction6);
function myFunction6() {
alert ("right"
"off");
}
document.getElementById("myBtn7").addEventListener("click", myFunction7);
function myFunction7() {
alert ("left"
"down");
}
document.getElementById("myBtn8").addEventListener("click", myFunction8);
function myFunction8() {
alert ("off"
"down");
}
document.getElementById("myBtn9").addEventListener("click", myFunction9);
function myFunction9() {
alert ("right"
"down");
}
</script>
</body>
</html>
【问题讨论】：
-
The goal is- 但结果如何 -
这可以用更短更优雅的方式完成
-
首先你的代码中有几个错别字，这甚至不会运行：
myFunction22有一个额外的2，在("click", myFunction4;处缺少一个)，等等。至少看看至少在问这里之前检查控制台，据我所知，没有任何努力调试或发现此代码的问题。
标签： javascript html