jQuery .show() 方法在 .click 函数中不起作用答案

【问题标题】：jQuery .show() method not working inside .click functionjQuery .show() 方法在 .click 函数中不起作用
【发布时间】：2013-04-30 22:31:00
【问题描述】：

下面的代码应该根据是否选中一个框来使文本框出现/消失（页面加载时文本框被隐藏）。所有警报都正常触发，但是我无法使.show() 功能的复选框起作用。

这里是 jQuery。这来自document.ready 函数内部。您可以从我对我尝试过的其他两种方法的注释中看到（均未奏效）。

    $('#OverrideRegionInd').click(function () {
        alert($(this).is(':checked'));
        if ($(this).is(':checked')) {
            alert("inside if");
            $('#Region').show();
            //$('#Region').css("display", "inline");
            // $('#Region').toggle();
            $('#territoryName').html("");
            $('#Region').val("");

        } else {
            alert("inside else");
            $('#Region').hide();
            //$('#Region').css("display", "none");
            // $('#Region').toggle();
        }
    });

这是视图中的代码

    <div class="M-editor-label">
        @Html.LabelFor(model => model.Region)
    </div>
    <div class="M-editor-field" id="territoryName">
        @Html.TextBoxFor(model => model.Region, new { style = "display: none;" })
        @Html.ValidationMessageFor(model => model.Region)
    </div>

这是为这组特定的<div>'s 呈现页面后的 HTML

    <div class="M-editor-label">
        <label for="Region">Territory</label>
    </div>
    <div class="M-editor-field" id="territoryName">
        <input id="Region" name="Region" style="display: none;" type="text" value="" />
        <span class="field-validation-valid" data-valmsg-for="Region" data-valmsg-replace="true"></span>
    </div>

【问题讨论】：

请注意，您可以使用if(this.checked) 做同样的事情...比$(this).is(':checked') 更少的开销。
您是否拥有多个具有相同 id 的元素？
只是提醒一下，您可以在没有 if / else 条件的情况下执行$('#Region').toggle(this.checked)，这样开销会更少吗？
$('#Region').closest('div').show()。试试这个。
@Omar - 当输入被隐藏时，如何显示最接近的 div 帮助？

标签： c# jquery asp.net-mvc asp.net-mvc-3 razor

【解决方案1】：

那是因为你在设置：

$('#territoryName').html("");

这是#Region 的父级，您实际上是在用该行删除#Region 元素。把它拿出来，它会正常工作的。

DEMO

【讨论】：