2012-01-27 70 views
0

我知道這個問題可能會因爲重複而被關閉(對不起,如果是),但在我的特殊情況下,可能會出現不同的問題,因爲功能不能按預期方式工作,是在其他類似的問題。獲取jQuery處理複選框單擊事件

假設我們有一個標記:

<div> 
    <label for="IsRecurring">Is Recurring</label> 
</div> 
<div> 
    <input id="IsRecurring" name="IsRecurring" type="checkbox" value="true"> 
    <input name="IsRecurring" type="hidden" value="false" />    
</div> 

<div id="schedulerTypesList" style="display:none"> 
    <div> 
     <label for="ScheduleTypeId">Schedule</label> 
    </div> 
    <div class="editor-field"> 
     <input type="hidden" name="ScheduleTypeId" id="ScheduleTypeId" value="" /> 

     <ul id="ScheduleTypeIdlist" > 
      <li>Once a weel</li> 
     </ul> 
    </div> 
</div> 

而一個JS附着在事件的document.ready:

$(document).ready(function() { 
    $('#IsRecurring').click(function() {   
     var thisCheck = $(this); 
     if (thischeck.is(':checked')) 
      $('#schedulerTypesList').show(); 
     } 
     else { 
      $('#schedulerTypesList').hide(); 
     }) 
    }); 

Demo in JSFiddle.

爲什麼複選框,單擊事件不切換顯示的div?

回答

3

有幾個問題!

$(document).ready(function() { 
    $('#IsRecurring').click(function() { 
     var thisCheck = $(this); 
     if (thisCheck.is(':checked')) { // added this closing bracket 
      $('#schedulerTypesList').show(); 
     } 
     else { 
      $('#schedulerTypesList').hide(); 
     } // added this closing bracket 
    }); 
}); 

缺少支架ifthischeck代替thisCheck後和加入正確閉合支架。工作演示:http://jsfiddle.net/manseuk/4DqXv/18/

+0

是的,我是一個dumbo =)謝謝。 – 2012-01-27 16:03:21

+0

@ MaximV.Pavlov我們都去過那裏.... :-) – ManseUK 2012-01-27 16:09:59