Question

这是我的登录视图：

@model SuburbanCustPortal.Models.LogOnModel

@{
    ViewBag.Title = "Log On";
}

<h2>Log On</h2>
<p>
  Please enter your user name and password. @Html.ActionLink("Register", "Register") if you don't have an account.
</p>

<p>
  If only you wish to make a payment on your account and do not want to create a website login, @Html.ActionLink("click here", "RedirectToPaymentPage", "Account").
</p>


@Html.ValidationSummary(true, "Login was unsuccessful. Please correct the errors and try again.")

@using (Html.BeginForm()) {
    <div>
        <fieldset>
            <legend>Account Information</legend>

            <div class="editor-label">
                @Html.LabelFor(m => m.UserName)
            </div>
            <div class="editor-field focus">
                @Html.TextBoxFor(m => m.UserName, new { @class = "GenericTextBox", onkeyup = "enableLogonButton()" })
                @Html.ValidationMessageFor(m => m.UserName)
            </div>

            <div class="editor-label">
                @Html.LabelFor(m => m.Password)
            </div>
            <div class="editor-field">
                @Html.PasswordFor(m => m.Password, new { @class = "GenericPasswordBox", onkeyup = "enableLogonButton()" })
                @Html.ValidationMessageFor(m => m.Password)
            </div>

            <div class="editor-label">
                @Html.CheckBoxFor(m => m.RememberMe)
                @Html.LabelFor(m => m.RememberMe)
            </div>

          <p>
            <button name="btn" value="Log On" onclick="disableButton()" disabled="disabled">Log On</button>
          </p>

          <p>
            If you need to retrieve your username @Html.ActionLink("click here.", "ForgotUsername", "Account")<br/>
            If you need to reset your password @Html.ActionLink("click here.", "ForgotPassword", "Account")
          </p>

        </fieldset>
    </div>
}

这是我的widget.js：

function enableLogonButton() {
  if ($('#UserName').val() == "") {
    $('#btn').attr('disabled', 'disabled');
    return;
  }
  if ($('#Password').val() == "") {
    $('#btn').attr('disabled', 'disabled');
    return;
  }
  $('#btn').removeAttr('disabled');
}

    function logonDisableSubmitButtons(clickedButton) {

        $("input[type='button']").each(function() {
          if (this.name != clickedButton)
            $(this).attr("disabled", "disabled");
          else {
            //hiding the actually clicked button
            $(this).hide();
            //Creating dummy button to same like clicked button
            $(this).after('<input type="button" disabled="disabled" value="' + $(this).val() + '" class="' + $(this).attr('class') + '" />');
          }
        });

      }

      function disableButton() {

        $('#btn').click(function (e) {
          $(this).attr('disabled', 'disabled');
        });


      }

无论我做什么，我都没有启用按钮。

我想要的是两件事：

当用户在登录和用户名中有内容时，请启用提交按钮。
当他们点击提交时，该按钮被禁用，因此他们无法点击两次。

我也没有运气。

我已在下方建议进行了更改，但在字段中输入内容后仍未启用该按钮

**进一步测试**

我按照建议添加了alert（）：

function enableLogonButton() {
  alert("start");
  if ($('#UserName').val() == "") {
    alert("username");
    $('#btn').attr('disabled', 'disabled');
    return;
  }
  if ($('#Password').val() == "") {
    alert("password");
    $('#btn').attr('disabled', 'disabled');
    return;
  }
  alert("enabled");
  $('#btn').removeAttr('disabled');
}

其中没有一个人开枪。至少，我没有得到提示。

所以，然后我改变了对它的调用以确保它甚至看到了JScript：

@Html.PasswordFor(m => m.Password, new { @class = "GenericPasswordBox", onkeyup = "enableLogonButtonX()" })

我收到了这条消息：

Microsoft JScript运行时错误：'enableLogonButtonX'未定义

所以，我相信它正在看JScript。

然后我添加了这个：

<script>
    function myFunction() {
      alert("hit!");
    }
</script>

并改变了这个：

 <button name="btn" value="Log On" onclick="myFunction()" disabled="disabled">Log On</button>

我的“打击”奏效了。所以，我相信onclick也在发挥作用。

Answer 1

disabled是布尔属性，不是属性。

设置：

$('#btn').attr('disabled', 'disabled');

要清除：

$('#btn').removeAttr('disabled')

Answer 2

除非我没有仔细阅读你的问题（不可否认，这可能就是这种情况，因为它是在5点之后......啤酒的时间）或者你的问题中有错字，我认为你的错误信息给出了你需要调试它的一切。

以下是您的消息：Microsoft JScript runtime error: 'enableLogonButtonX' is undefined

以下是您的函数名称：enableLogonButton

因此，根据错误消息，您正在调用函数enableLogonButtonX()，但您的函数名为enableLogonButton。改为：

@Html.PasswordFor(m => m.Password, new {
        @class = "GenericPasswordBox", 
        onkeyup = "enableLogonButton()" })

Answer 3

而不是更改disable属性的值，而不是从元素中完全删除它。

即。替换此

$('#btn').attr('disabled', false);

用

$('#btn').removeAttr('disabled');

Javascript启用/禁用按钮无法按预期工作

3 个答案: