Question

我是使用jQuery的新手。我正在使用c＃/ net来创建和编辑视图。在我的创建视图中，我有：

<div class="editor-label">
    @Html.LabelFor(model => model.Pregnant)
</div>

<div class="editor-field">
    @Html.EditorFor(model => model.Pregnant)
    @Html.ValidationMessageFor(model => model.Pregnant)
</div>

<div class="editor-label dueDate">
    @Html.LabelFor(model => model.DueDate)
</div>

<div class="editor-field dueDate">
    @Html.TextBox("DueDate", null, new { @class = "datepicker" }) 
    @Html.ValidationMessageFor(model => model.DueDate)
</div>

$(function() {
    $('.dueDate').hide();
    $('#Pregnant').change(function() {
        if ($('#Pregnant').is(':checked')) {
            $('.dueDate').show();
        }
        else {
            $('.dueDate').hide();
        }
    });

这样可以正常工作，如果勾选了怀孕的勾选框，则显示截止日期。

我遇到的问题是当我进入编辑页面时...如果我在dueDate被隐藏在加载时使用相同的代码，无论勾选方框是否勾选。这就是代码所说的内容。

我想在编辑页面中检查是否勾选了勾选框，然后在加载时进行正确显示或隐藏。 - 我是jQuery的新手，所以不知道该怎么做。

伪代码：

onload
    if #pregnant.is checked
        then show dueDate
    else
        dueDate.hide and empty dueDate Value

我试过了：

$('.dueDate').val('');

希望这是有道理的。

Answer 1

如果有id="Pregnant"的一个复选框和class="duedate"的一个或多个元素，那么代码可能是

 $('#Pregnant').on("click",function () {
   $('.dueDate').toggle(this.checked);
 });

如果有多个复选框，则不能使用ID，因为它必须是唯一的，而不是使用class，如果需要显示特定的duedate，则可能使用data属性

Answer 2

在运行$（'。dueDate'）之前.hide（）;代码，您只需添加一个if，只有在取消选中该复选框时才隐藏它。

if (!$('#Pregnant').is(':checked'))
    $('.dueDate').hide();

jQuery，复选框然后隐藏并在需要时清空值

2 个答案: