图像隐藏在复选框

在开始时，复选框被选中并且图像显示在下面。当复选框未选中时图像隐藏，如果复选框被再次选中，图像将再次显示。图像隐藏在复选框

<form action=""> 
<div> 
    <input type="checkbox" checked="checked" /> House <br /> 
    <input type="checkbox" checked="checked" /> Car <br /> 
    <input type="checkbox" checked="checked" /> Tree <br /> 
    </div> 
</form> 
<p> 
<img src="house.jpg" alt="House" /> 
<img src="car.jpg" alt="Car" /> 
<img src="tree.jpg" alt="Tree" /> 
</p> <script type="text/javascript"> 
<!-- function selectImage(checkbox) { var counter = 0 for (var i = 0; i < checkbox.length; ++i) { if (checkbox[i].checked) ++stevec } return counter } 
//--> </script>

来源

2014-04-07 user3507447

<形式行动= “”>

House
Car
Tree

House Car Tree

<脚本类型= “文本/ JavaScript的”>功能selectImage（复选框） { var counter = 0 for（var i = 0;我 – user3507447

你应该增加更多的细节，你尝试过什么等等。 [这个堆栈溢出指南]（http://stackoverflow.com/questions/how-to-ask）也可能对未来的问题很有帮助。 [这个问题]（http://stackoverflow.com/questions/5539139/change-get-check-state-of-checkbox）中的代码包括增加'onclick'事件的功能，这应该足以满足您的需求去做。 – talegna

请在您的问题中包含您的代码** – George

input[type="checkbox"] ~ img { display: none; } 
input[type="checkbox"]:checked ~ img { display: inline; }

Demo

来源

2014-04-07 15:59:10 Oriol

谢谢！但是你可以在JAVASCRIPT中编写这个吗？ – user3507447

@ user3507447为什么使用JavaScript，如果你可以用CSS做到这一点？ – Oriol

图像隐藏在复选框

回答

相关问题