當至少有兩個複選框選中時顯示div

Question

當兩個或多個複選框被選中時，我需要顯示div。 我有一個工作JSfiddle。 JavaScript的推移

<script type="text/javascript"> 
       $(function(){ 
       $('#checkobox').change(function(){ 
        alert($('input:checked').size()) 
         if($('input:checked').size() > 1){ 
         $('div').show(); 
        } 
        else { 
         $('div').hide() 
        } 
       }); 
      </script> 

HTML內容

  <input type="checkbox" id="one"></input> 
     <input type="checkbox" id="one"></input> 
     <input type="checkbox" id="one"></input> 
     <div style="display: none;">At least 2 are checked</div> 

我在同一頁面另一個腳本來選擇所有，是衝突這兩複選框選擇。

<script language="javascript" type="text/javascript"> 
       $(document).ready(function() { 
       $('#checkall').click(function(event) { //on click 
        if(this.checked) { // check select status 
         $('.checkbox1').each(function() { 
          this.checked = true;     
         }); 
        }else{ 
         $('.checkbox1').each(function() { 
          this.checked = false;      
         });   
        } 
       }); 
      }); 
     </script> 

此代碼工作正常，但不在本地主機和服務器。 顯示你的技能......給我一個solution..thanks

Answer 1

你需要用你的腳本中$(function(){或$(document).ready(function(){，這樣它會改變事件綁定到複選框，當整個DOM已準備就緒。還要確保你已經在你的腳本中包含了jQuery庫。

編輯： - 刪除與其他腳本衝突，你可以把class="one"你的複選框（我已刪除id="one"因爲你不能使用多個元素相同ID），如下圖所示，改劇本相應

HTML

<input type="checkbox" class="one"></input> 
<input type="checkbox" class="one"></input> 
<input type="checkbox" class="one"></input> 
<div style="display: none;">At least 2 are checked</div> 

的jQuery：

$(function(){ 
    $('input[type=checkbox].one').change(function(){ 
    alert($('input[type=checkbox].one:checked').size()) 
     if($('input[type=checkbox].one:checked').size() > 1){ 
     $("div").show(); 
    } 
    else { 
     $('div').hide() 
    } 
    }); 
}); 

JSFiddle Demo