所以,我正在尝试编写一些代码,当您选中复选框时,它会停止在我的网站上显示图片。我的文本软件和控制台中没有语法错误。任何人都可以告诉我这段代码有什么问题吗?
function Checkbox(element){
var pic=document.getElementsByTagName("img");
if(element.checked==true){
for(var i=0; i<pic.length; i++){
pic[i].style.display="none";
}
}
else if(element.checked==false){
for(var i=0; i<pic.length; i++){
pic[i].style.display="auto";
}
}};
//picDisplay is the id of my checkbox
var picDisplay=document.getElementById("picDisplay");
picDisplay.addEventListener("click",Checkbox(picDisplay)
答案 0 :(得分:0)
看看这个小提琴:https://jsfiddle.net/yLb1xteu/
代码中的主要问题是您需要将函数指针传递给Checkbox
中的picDisplay.addEventListener
函数。相反,您正在运行Checkbox
函数并将结果(基本上没有任何内容)传递给addEventListener
,这并没有做太多。
同样命名一个函数Checkbox
并不是最好的 - 只是抛弃它。可能想要命名为togglePictures
。 :)
玩得开心!
答案 1 :(得分:0)
我已经尝试过您正在寻找的样本。
<input type="checkbox" id="picDisplay" onchange="Checkbox()"
>
<div style="width:10%;">
<img src="http://www.ricoh-imaging.co.jp/english/r_dc/caplio/r7/img/sample_04.jpg" style="width:100%;">
</div>
<script>
function Checkbox(){
var Checkbox_value = document.getElementById("picDisplay");
var pic=document.getElementsByTagName("img");
if(Checkbox_value.checked==true){
for(var i=0; i<pic.length; i++){
pic[i].style.display="none";
}
}
else if(Checkbox_value.checked==false){
for(var i=0; i<pic.length; i++){
pic[i].style.display="block";
}
}};
</script>
Try the code given above and think this is helpful