Question

我是一个javascript / jquery初学者。

单击复选框时，我正在尝试灰显，禁用和更改文本框的背景颜色。我在实施我在网上找到的可能解决方案时遇到了麻烦。

这是我正在使用的代码：

<% using (Html.BeginForm()) { %>
    <span id="errorMsg">
        <%:(ViewData["ErrorMessage"])%>
    </span>
    <div>
        <fieldset>
            <legend>Account Information</legend>

            <div class="editor-label">
                <%: Html.LabelFor(m => m.UserName) %>
            </div>
            <div id="UserName" class="editor-field">
                <%: Html.TextBoxFor(m => m.UserName) %>
                <%: Html.ValidationMessageFor(m => m.UserName) %>
            </div>

            <div id "Password" class="editor-label">
                <%: Html.LabelFor(m => m.Password) %>
            </div>
            <div class="editor-field">
                <%: Html.PasswordFor(m => m.Password) %>
                <%: Html.ValidationMessageFor(m => m.Password) %>
            </div>
            <div id="checkBox" class="editor-field">
                <%: Html.CheckBoxFor(m => m.UseNetworkCreds %>  Use Network Credentials
                <%: Html.ValidationMessageFor(m => m.UseNetworkCreds)%>
            </div>


            <p>
                <input type="submit" value="Log On" />
            </p>

       </fieldset>
    </div>
<% } %>

如何修改此代码以执行我提到的操作？我希望复选框灰显/禁用用户名和密码文本框。

Answer 1

在使用/目前已编写的代码中我看不到任何javascript。要实现您在问题中描述的目标，您需要编写一些JavaScript代码。例如，您可以订阅复选框的.change()事件，然后在两个输入字段上切换readonly属性，其中包括：

$(function() {
    $('#UseNetworkCreds').change(function() {
        if ($(this).is(':checked')) {
            $('#UserName, #Password').attr('readonly', 'readonly');
        } else {
            $('#UserName, #Password').removeAttr('readonly');
        }
    });
});

复选框= true上的ASP.NET MVC灰色字段

1 个答案: