有人知道这是为什么吗?
我试图通过单击相应的按钮来隐藏这三个区域中的任何一个。
这是我的代码:
<div id="prod">Prod
<button type="button" onclick="myFunction()" class="prodButton">Hide</button>
<script>
function myFunction() {
document.getElementById("prod").style.visibility = "hidden";
}
</script>
</div>
<div id="test">Test
<button type="button" onclick="myFunction()" class="testButton">Hide</button>
<script>
function myFunction() {
document.getElementById("test").style.visibility = "hidden";
}
</script>
</div>
<div id="dev">Dev
<button type="button" onclick="myFunction()" class="devButton">Hide</button>
<script>
function myFunction() {
document.getElementById("test").style.visibility = "hidden";
}
</script>
</div>
最佳答案
每次你这样做:
function myFunction() {
您显然是在重新定义函数(取消旧函数并创建新函数,以便最后一个函数胜出)。您需要以接受参数并基于它应该做某事的方式来制作它。您误用或没有理解函数的概念。
最终你的函数应该是这样的:
function myFunction(element) {
document.getElementById(element).style.visibility = "hidden";
}
只定义一次,应该多次调用,如下所示:
myFunction("prod");
myFunction("test");
myFunction("dev");
完整代码
<script>
function myFunction(element) {
document.getElementById(element).style.visibility = "hidden";
}
</script>
<div id="prod">Prod
<button type="button" onclick="myFunction(\"prod\")" class="prodButton">Hide</button>
</div>
<div id="test">Test
<button type="button" onclick="myFunction(\"test\")" class="testButton">Hide</button>
</div>
<div id="dev">Dev
<button type="button" onclick="myFunction(\"dev\")" class="devButton">Hide</button>
</div>
关于javascript - 为什么同名的三个函数只能工作一次?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41166016/