c# - jQuery .show() 方法在 .click 函数中不起作用

Question

下面的代码应该根据是否选中一个框来使文本框出现/消失(文本框在页面加载时隐藏)。所有警报都正常触发，但我无法选中 .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();
        }
    });

这是 View 中的代码

    <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> 呈现页面后的 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>

Answer 1

那是因为你要设置:

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

那是 #Region 的父元素，您实际上是在用该行删除 #Region 元素。将其取出，它会正常工作。

DEMO