當使用jquery取消選中複選框時隱藏文本

默認情況下複選框處於選中狀態。如果未選中，他們應該隱藏文字。我如何隱藏或顯示jquery中的文本？當使用jquery取消選中複選框時隱藏文本

HTML：

<div class="check"> 
<p><input type="checkbox" value="Name" id="name" checked /> <label for="name">Name</label></p> 
<p><input type="checkbox" value="Reference " id="reference" checked /> <label for="reference">Reference</label></p> 
    </div> 

    <div id="nametxt"> Show Name TEXT </div> 
    <div id="reftxt"> Show Ref TEXT </div>

來源

2010-07-22 input

變化<div id="reftxt">到<div id="referencetxt">和ID，那麼你可以這樣做：

$('div.check input:checkbox').bind('change',function(){ 
    $('#'+this.id+'txt').toggle($(this).is(':checked')); 
});

更改事件將觸發，如果它，或者如果有人使用點擊鍵盤檢查/取消選中複選框。

只要ID的文本div始終是checkbox ID + 'txt'並且在div.check那麼這也將處理這些。當您獲得更多複選框時，讓您不必重複自己。

來源

2010-07-22 19:24:17 PetersenDidIt

短而甜。謝謝！ – input 2010-07-22 19:36:22

優秀的答案，謝謝！ – Dan 2013-05-08 04:39:50

<script type="text/javascript" charset="utf-8"> 
    $(document).ready(function() { 
     $("#name").click(function() { 
      if($('#name:checked').length) { 
       $("#nametxt").show(); 
      } else { 
       $("#nametxt").hide(); 
      } 
     }); 

     $("#reference").click(function() { 
      if($('#reference:checked').length) { 
       $("#reftxt").show(); 
      } else { 
       $("#reftxt").hide(); 
      } 
     }); 
    }) 
</script>

來源

2010-07-22 19:20:02

我試過了。如果我取消選中，它會隱藏，但是當我再次檢查時，它不顯示任何內容。我錯過了什麼？ – input 2010-07-22 19:32:25

我編輯了代碼。請再試一次。 – 2010-07-22 19:35:45

謝謝你的代碼。 upvoted。 – input 2010-07-22 19:38:45

-4

如果複選框未選中如何通過Jquery的顯示味精，

您必須勾選站點框中接受。

來源

2012-03-02 15:39:27 Annie

當使用jquery取消選中複選框時隱藏文本

回答

相關問題