如何使用單選按鈕隱藏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個。我嘗試了上面的答案，甚至沒有工作，然後我看到@AdriánDaraš評論，我與所有其他Javascript進行了交叉檢查。現在它的工作正常，因爲我刪除了我用來使單選按鈕看起來不錯的Javascript。非常感謝大家。

來源

2016-10-17 06:22:31 Shehzi

嘗試像這樣

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


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

來源

2016-10-15 12:53:32

小心解釋。 –

請從頭部標記頂部或文件底部添加jquery。並寫入準備好DOM準備好的jquery文件，然後編寫你的必要代碼，那 –

添加了jquery cdn和帶有id的div框來測試hide函數。然後我用jQuery（），這是調用jquery的常用方法。

更改函數偵聽兩個輸入並檢查輸入的值以知道是否必須隱藏或顯示框。

以下解決方案：

<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

回答

相關問題