javascript - 我需要一个脚本来在开关按钮打开时复制 标签，并在开关按钮关闭时删除 标签

Question

我需要一个脚本来复制<img>当开关按钮打开时标记，当开关按钮关闭时删除标记。我需要一个简单的方法。这是开关按钮:

<div class="onoffswitch">
  <input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch" checked>
  <label class="onoffswitch-label" for="myonoffswitch">
    <span class="onoffswitch-inner"></span>
    <span class="onoffswitch-switch"></span>
  </label>
</div>

我试过这个:

<script language="javascript">
        var changeImage = function(){
            img1="image/rez.jpg";
            switch(document.getElementById('myonoffswitch').src){
                case img1:
                    document.getElementById("myonoffswitch").src=img1;
                break;
                default:
                    document.getElementById("chango").src=img1;
                break;
            };
        };
    </script>

Answer 1

如果你只想显示/隐藏图像，你可以使用如下简单的 CSS。

CSS

#myonoffswitch ~ img
{
 display:none;
}
#myonoffswitch:checked ~ img
{
 display:block;
}

HTML

 <div class="onoffswitch">
   <input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch" checked>
    <label class="onoffswitch-label" for="myonoffswitch">
     <span class="onoffswitch-inner"></span>
     <span class="onoffswitch-switch"></span>
    </label>
   <img src="http://isc.stuorg.iastate.edu/wp-content/uploads/sample.jpg" />
 </div>

DEMO