Javascript 选中复选框时隐藏文本框

选中“更新”复选框时，我使用jquery启用3个字段（“撤回”、“电子邮件”和“序列号”）。它正在工作，但我更希望在选中“更新”复选框之前，我的“电子邮件”和“序列号”字段实际上是隐藏的，但是我不确定如何正确隐藏它们&然后使用什么jquery代码来取消隐藏它们。如果未选中“更新”，我还希望字段返回其原始状态。请帮忙

    <div class="form-inline">
    <div class="checkbox" id="initialNotification">
        <label>
            @Html.CheckBoxFor(m => m.Notification.Intial) Initial notification
        </label>
    </div>    
    <div class="checkbox" id="update" checked ="false">
        <label>
            @Html.CheckBoxFor(m => m.Notification.Update) Update to an existing notification
        </label>
    </div>
</div>
    <div class="form-inline">
    <div class="form-group">
        @Html.LabelFor(m => m.Notification.SerialNumber)
        @Html.TextBoxFor(m => m.Notification.SerialNumber, new { @class= "form-control", @disabled = "disabled" })
        @Html.ValidationMessageFor(m => m.Notification.SerialNumber)

    </div>
    <div class="form-group">
        @Html.LabelFor(m => m.Notification.Email)
        @Html.TextBoxFor(m => m.Notification.Email, new { @class = "form-control", @disabled = "disabled" })
        @Html.ValidationMessageFor(m => m.Notification.Email)

    </div>
</div>

    <div class="checkbox" id="withdrawn">
        <label>
            @Html.CheckBoxFor(m => m.Notification.Withdrawn, new { @disabled = "disabled" }) The project has been withdrawn
        </label>
    </div>

    @section scripts
{
        <script>         

            $(document).ready(function () {
                $("#Notification_Update").attr("checked", false)
                $("#@Html.IdFor(m => m.Notification.Update)").trigger("click");             

            });            
            $("#@Html.IdFor(m => m.Notification.Update)").on("click", function () {                
                if ($(this).is(":checked") || @(Model.Notification.Update.ToString().ToLower()) == true) {
        $(".to-hide").show();
    }
    else {
        $(".to-hide").hide();
    }
            });            
          </script>

    }

@（m=>m.Notification.Initial）初始通知的Html.CheckBoxFor
@Html.CheckBoxFor（m=>m.Notification.Update）对现有通知的更新
@LabelFor（m=>m.Notification.SerialNumber）
@Html.TextBoxFor（m=>m.Notification.SerialNumber，新的{@class=“form control”，@disabled=“disabled”}）
@Html.ValidationMessageFor（m=>m.Notification.SerialNumber）
@LabelFor（m=>m.Notification.Email）
@Html.TextBoxFor（m=>m.Notification.Email，新的{@class=“form control”，@disabled=“disabled”}）
@Html.ValidationMessageFor（m=>m.Notification.Email）
@Html.CheckBoxFor（m=>m.Notification.retracted，new{@disabled=“disabled”}）项目已撤回
@节脚本
{
$（文档）.ready（函数（）{
$（“通知更新”）.attr（“选中”，false）
$（“#@Html.IdFor（m=>m.Notification.Update）”）.trigger（“单击”）；
});            
$（“#@Html.IdFor（m=>m.Notification.Update）”）。在（“单击”，函数（）{
if（$（this）.is（“：checked”）| |@（Model.Notification.Update.ToString（）.ToLower（））==true）{
$（“.to hide”）.show（）；
}
否则{
$（“.to hide”）.hide（）；
}
});            
}

试试这个：

将类添加到将隐藏的元素的容器中，例如：

<div class="form-inline to-hide">

下面是简化的代码

（可选）在

文档上运行该事件。就绪
：

$(document).ready(function() {
    $("#@Html.IdFor(m => m.Notification.Update)").trigger("click");
});

$（“#更新”）。在（“单击”，函数（）{
$（“.to hide”）[（$（this）.is（“：checked”）？“show”：“hide”）]（）；
}).触发（“点击”）

隐藏我
尝试以下操作：

将类添加到将隐藏的元素的容器中，例如：

<div class="form-inline to-hide">

下面是简化的代码

（可选）在
文档上运行该事件。就绪
：

$(document).ready(function() {
    $("#@Html.IdFor(m => m.Notification.Update)").trigger("click");
});



$（“#更新”）。在（“单击”，函数（）{
$（“.to hide”）[（$（this）.is（“：checked”）？“show”：“hide”）]（）；
}).触发（“点击”）

隐藏我
这是ASP.NET MVC吗？在css中使用
display:none
，然后在jquery中使用
.show（）
.Hide（）
，您还想检查
这一点。在更改函数中选中了
。谢谢&对不起，应该提到我在使用MVC5。这是ASP.NET MVC吗？在css中使用
display:none
，然后使用
.show（）
/
.hide（）
在jquery中，您还需要检查
这一点。在您的更改功能中检查了
。谢谢&对不起，我应该提到我正在使用MVC5。非常感谢，这正是我想要的，只有在表单首次加载时，“序列号”和“电子邮件”才可见。我需要添加什么才能使它们最初隐藏起来？@johnewbie the item#3应该可以做到这一点。它将在页面加载时运行事件，因此，如果复选框开始选中或未选中，事件应完成其工作，并显示/隐藏容器。@JohnNewbie示例：如果您手动向复选框添加
checked=“false”
，则
触发器（“单击”）
将管理该状态。对不起，我是个完全的新手，所以我有点困惑，我需要第1、2和3部分来完成这项工作吗？在第3部分之前我都很好，但是当我尝试实现最后一部分时，它就停止工作了me@JohnNewbie没问题。你需要第1部分和第2部分。第三种方法是打开隐藏元素的页面，以防复选框未选中，反之亦然。检查更新。非常感谢，这正是我想要的，只有在表单第一次加载时，“序列号”和“电子邮件”才可见。我需要添加什么才能使它们最初隐藏起来？@johnewbie the item#3应该可以做到这一点。它将在页面加载时运行事件，因此，如果复选框开始选中或未选中，事件应完成其工作，并显示/隐藏容器。@JohnNewbie示例：如果您手动向复选框添加
checked=“false”
，则
触发器（“单击”）
将管理该状态。对不起，我是个完全的新手，所以我有点困惑，我需要第1、2和3部分来完成这项工作吗？在第3部分之前我都很好，但是当我尝试实现最后一部分时，它就停止工作了me@JohnNewbie没问题。你需要第1部分和第2部分。第三种方法是打开隐藏元素的页面，以防复选框未选中，反之亦然。检查更新。