Javascript 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>

你可以看到

如果我从左侧面板中选择jQuery 1.8.3，它可以正常工作，但是如果我选择1.10.1，它就不能工作。我还在我的项目中使用1.10.2。因此，我想知道如何在不使用.slideDown/.show和.slideUp/.show的情况下完成工作？换句话说，我的逻辑是好的还是你能提供更好的

使用.change事件和此事件的实例

失败发生在.attr方法上-应该是.prop进行检查，但是您可以这样做。检查以获得更快的结果

小提琴：

我用钮扣做的

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

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

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

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

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

$(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');
      }
  });
});

$('#divyes').toggle('slow');