jQuery的隱藏/顯示窗體的某些部分

我有我在下面給它的一部分的一種形式：jQuery的隱藏/顯示窗體的某些部分

<input type="checkbox" id="yes" name="yes" value="1" />Yes 

<div id="divyes"> 
    <div class="form-group"> 
     <label for="hey">Hey</label> 
     <select class="form-control input-sm" id="hey" name="hey"> 
     </select> 
    </div> 
    <div class="form-group"> 
     <input type="text" class="form-control input-sm" id="yes2" name="yes2" /> 
    </div> 
    <div class="form-group"> 
     <input type="text" class="form-control input-sm" id="yes3" name="yes3" /> 
    </div> 
</div>

我試圖表現出或根據複選框的隱藏表單的某些部分檢查statu。

$(function() { 
    $("#divyes").hide(); 

    $("#yes").click(function() { 

     if ($("#yes").attr("checked")) { 
      $("#divyes").slideDown(); 
     } else { 
      $("#divyes").slideUp(); 
      $("#divyes > input").text(""); 
     } 
    }); 
});

你可以看到fiddle here

如果我從左側面板它工作正常，但如果我選擇1.10.1這是行不通的選擇jQuery 1.8.3。我也在我的項目上使用1.10.2。所以我想知道如何在不使用.slideDown()/.show()和.slideUp()/.show()的情況下完成我的工作？換句話說，我的邏輯是好還是可以提供更好的？

來源

2014-03-06 zkanoca

使用.change()事件和this

$("#yes").change(function() { 

    if (this.checked) { 
     $("#divyes").slideDown(); 
    } else { 
     $("#divyes").slideUp(); 
     $("#divyes > input").text(""); 
    } 
});

的故障是發生在.attr方法實例 - 它應該是.prop檢查，但是你可以做this.checked用於更快的結果。

小提琴：http://jsfiddle.net/a3j5V/4/

來源

2014-03-06 22:07:08 tymeJV

$(function() { 
    var yes_cont = $("#divyes"); 
    var yes_checkbox = $("#yes"); 
    yes_cont.hide(); 
    yes_checkbox.click(function() { 
    if ($(this).is(':checked')) { 
     yes_cont.slideToggle('up'); 
    } else { 
     yes_cont.slideToggle('down'); 
     } 
    }); 
});

http://jsfiddle.net/rY4Ts/15/

來源

2014-03-06 22:10:12 JohanVdR

我toggle