Question

单击复选框时，我需要显示图像和有关该项目的一些信息。出于某种原因，没有任何事情发生，我已经调整了一段时间没有任何回应。这是我的javascript：

<script type = "text/javascript">
    function displayOnChecked(var checkboxID, var id) {
        if(document.getElementById(checkboxID)) {
            document.getElementById(id).style.display = "block";
        } else {
            document.getElementById(id).style.display = "none";
        }
    }
</script>

在样式表中，我在display: none;

上找到它

这是我的一个调用：

<input type="checkbox" name="purchasedItem" id = "item" onclick="displayOnChecked('item', 'itemInfo');">

Answer 1

var的参数列表中不需要displayOnChecked关键字，只需要变量名称。

如果您查看控制台，则应收到错误：Uncaught SyntaxError: Unexpected token var

Answer 2

您不要将变量初始化为函数参数：

function displayOnChecked(var checkboxID, var id)

应该是

unction displayOnChecked(checkboxID, id)

Answer 3

只需使用CSS 伪元素 :checked即可实现此目的：

＆＃13;

.checkmeout {
display: none;
position: absolute;
top: 12px;
left: 150px;
width: 400px;
height: 100px;
padding: 12px;
color: rgb(255,255,255);
background-color: rgb(255,0,0);
}

.checkmeout img {
display: block;
width: 200px;
height: 50px;
background-color: rgb(0,0,255);
}

.checkme:checked ~ .checkmeout {
display:block;
}

＆＃13;

<form>
<input type="checkbox" name="checkme" class="checkme" /> Check Me

<div class="checkmeout">
<img src="" alt="Check Me Out Image" />
<p>Check Me Out Text Description</p>
</div>
</form>

＆＃13;

我试图在点击一个复选框时显示一个div

3 个答案: