1 
<html>
   <head>
      <script type="text/javascript">
         function hideshow(which){
            if (!document.getElementById)
               return
            if (which.style.display=="block")
               which.style.display="none"
            else
               which.style.display="block"
         }
      </script>
   </head>
   <body>
     credit card
     <a href="javascript:hideshow(document.getElementById('adiv123'))">
        <input type="checkbox"  />
     </a>   
     <div id="adiv123" style="font:24px normal; style=display:block;">
        check
           <input type="text" name="check" class="styled"/>
     </div>
   </body>
</html>

プログラムの出力は、チェックボックスをオンにするとテキストを表示し、チェックボックスをオフにするとテキストを非表示にする必要があります。この場合、出力を初めて開いたときに、チェックボックスをチェックせずにテキストが表示されました。なぜそれが起こったのか誰かが明らかにできますか？

4

3 に答える 3

1

これは、チェックボックスをクリックするまで関数を実行しないために発生hideshowします (なぜリンクにラップしたのですか?)。そのため、pageload の後、checkbox 要素の状態に関係なく、隣接する div が常に表示されます。

とにかく、IE8 以前をサポートしていない場合は、css のみで同じ動作を実現できます。例えば

html

<input type="checkbox"  />
<fieldset>
    <span>checked</span>
    <input type="text" name="check" class="styled"/>
</fieldset>

CSS

input + fieldset { display: none }
input:checked + fieldset { display: block }
于 2013-06-04T07:48:12.397 に答える
0

まず、あなたのマークアップは無効です。具体的には、次のとおりです。

style="font:24px normal; style=display:block;"

間違っている。私はあなたがこれを意味したと思います：

style="font:24px normal; display:block;"

ページの読み込み時に要素を非表示にしたい場合は、実際にはこれが必要でした:

style="font:24px normal; display:none;"
于 2013-06-04T07:46:19.687 に答える
0

ここを見てください：http://jsfiddle.net/Uhcxd/

コード

document.getElementById("adiv123").style.display = "none";
document.getElementById("showHide").onchange = function(){
    if(this.checked)
         document.getElementById("adiv123").style.display = "block";
    else
        document.getElementById("adiv123").style.display = "none";
}

または、コードに基づいて: http://jsfiddle.net/Uhcxd/1/

私はこれを変更しました：

<div id="adiv123" style="font:24px normal; style=display:block;">

これに

<div id="adiv123" style="font:24px normal;display:none;">
于 2013-06-04T07:47:59.760 に答える