javascript 我尝试在选中复选框后显示图像,但代码不起作用

xwmevbvl  于 2023-01-11  发布在  Java
关注(0)|答案(3)|浏览(108)

下面是我的代码:

<form>
            White
            <input id="white" type="checkbox" onclick="checkMe()"/>
            <img id="www" style="display: none;" src="assets/2.jfif" alt="shirt">
        </form>
        <script>
        function checkMe(){
            var cb = document.getElementById("white");
            var img = document.getElementById("www");
            if(cb.checked==true){
                text.style.display="block";
            } else {
                text.style.display="none";
            }
        }
        </script>

复选框表示它正在被选中,但图像没有显示。我尝试了可能的解决方案,但没有帮助。任何见解将不胜感激。

xzv2uavs

xzv2uavs1#

找到解决办法了。

text.style.display="block";
text.style.display="none";

将文本替换为img

xesrikrc

xesrikrc2#

var cb = document.getElementById("white");
var img = document.getElementById("www");

function checkMe() {

  if (cb.checked == true) {
    img.style.display = "block";
  } else {
    img.style.display = "none";
  }

}
<input id="white" type="checkbox" onclick="checkMe()" />
<img id="www" style="display: none;" src="https://sample-videos.com/img/Sample-png-image-100kb.png" alt="shirt">

简单方法-无J
一个二个一个一个

lyfkaqu1

lyfkaqu13#

您只需在JavaScript函数中用图像选择器变量替换错误的选择器。

下面是我和你分享的函数。你应该用旧的函数替换这个函数。

function checkMe() {
    var cb = document.getElementById("white");
    var img = document.getElementById("www");
    if (cb.checked == true) {
        img.style.display = "block";
    } else {
        img.style.display = "none";
    }
}

相关问题