ラジオボタンを使用してdivを非表示にする方法

div idで表されるフィールド全体を非表示にしたいとします。私はそれをやってみたが、それは働かない。私はドロップダウンリストを使用して選択したときに動作させることができました。ここに私のコードは次のとおりです。ラジオボタンを使用してdivを非表示にする方法

HTML：

<div class="form-group"> 
    <p> 
     <input type="radio" class="flat" name="botsign" id="signature" value="show" checked="checked"/> 
     Show Signature 
     <br><br> 
     <input type="radio" class="flat" name="botsign" id="signature" value="hide" /> 
     Hide Signature 
    </p> 
</div>

JS：

<script> 
    $("input[name='botsign']").change(function() { 
     if ($(this).val() == 'show') { 
      $("#Sigbox").show(); 
     } else { 
      $("#Sigbox").hide(); 
     } 
    }); 
</script>

CSS：

#Sigbox{ 
     display:none; 
     }

出典

2016-10-15 Shehzi

コードはうまくいきます。スクリプトの前にjQueryをロードしてみてください。 –

私はいくつかの矛盾するJavascriptを持っていました。それが削除されると、正常に動作しています。 @AdriánDarašありがとう – Shehzi

は私を助けてくれてありがとう。投稿したコードは正常に動作しますが、JavaScriptコードの競合が発生している箇所が6つあります。私は上記の答えを試しても、そのdidnt仕事、その後、私は@AdriánDarašのコメントを見て、私は他のすべてのJavascriptsとチェッククロス。私はラジオボタンを見栄え良くするために使用していたJavascriptを削除しました。ありがとうございます。

出典

2016-10-17 06:22:31 Shehzi

この

のように試してみてください3210

出典

2016-10-15 12:53:32

気をつけてください。 –

jqueryを頭のタグの上部またはファイルの末尾に追加してください。 DOM準備ができたらjqueryドキュメントを作成して、必要なコードを書いてください。それは –

idを指定したjquery cdnとdivボックスを追加して、hide関数をテストしました。それから、jQuery（）を使ってjqueryを呼び出すのが普通の方法です。

change関数は、入力の両方をリッスンし、入力値をチェックして、ボックスを非表示または表示する必要があるかどうかを確認します。

ここにあなたのソリューション：

<html> 
    <head> 
     <script type="text/javascript" src="http://code.jquery.com/jquery-3.1.1.min.js"></script> 
    </head> 
    <body> 
     <div class="form-group"> 
      <p> 
       <input type="radio" 
         class="flat" 
         name="botsign" 
         id="signature" 
         value="show" 
         checked="checked"/> 
       Show Signature 
       <br><br> 
       <input type="radio" 
         class="flat" 
         name="botsign" 
         id="signature" 
         value="hide" /> 
       Hide Signature 
      </p> 
     </div> 
     <div id="Sigbox"> 
      hello i'm your sign box 
     </div> 
     <script> 
      jQuery("input[name='botsign']").change(function() { 
       if (jQuery(this).val() == 'show') { 
        jQuery("#Sigbox").show(); 
       } else { 
        jQuery("#Sigbox").hide(); 
       } 
      }); 
     </script> 
    </body> 
</html>

出典

2016-10-15 13:06:59 jedi

@ZakariaAcharki私は答えを編集しました – jedi

ラジオボタンを使用してdivを非表示にする方法

答えて

関連する問題