1

チェックボックスがチェックされているときにdivの表示を交換（トグル）し、チェックボックスがチェックされていないときに元のdivに戻る方法を見つけようとしています。

JQuery トグルはこれに最適なように見えましたが、現在は価値が低下しています。したがって、純粋な JavaScript アプローチが最適/最も簡単であると思われます。

どんな助けでも大歓迎です。

ありがとう、

リック

<input name="checkbox" type="checkbox" value="checkbox">Show Hidden Div ?</p>
<div id="layerOne">This DIV is shown by default and hidden when the checkbox is checked</div>
<div id="layerTwo">This DIV is hidden by default and shown when the Checkbox is checked</div>
4

2 に答える 2

0

純粋な JavaScript アプローチ

JavaScript

 var button = document.getElementById('toggle'),
        text = document.getElementById('text');

    button.onclick = function() {
      var isHidden = text.style.display == 'none';
      text.style.display = isHidden ? 'block' : 'none';
    };

html

 <button id="toggle">Toggle</button>
  <div id="text">Lorem ipsum dolor sit amet.</div>

デモ

于 2013-10-23T15:42:41.043 に答える