onkeyup事件不适用于rails

Question

这是此问题的视图代码片段

    <div class="col-md-6">
      <div class="form-group form-merchant">
        <%= f.password_field :password, class: "form-control inputs",placeholder:"Password" , required: true , id: 'password' , onchange: 'disableregisterbutton()'  %>
      </div>
    </div>

    <div class="col-md-6">
      <div class="form-group form-merchant">
        <%= f.password_field :password_confirmation, class: "form-control inputs",placeholder:"Confirm Password" , required: true , id: 'confirm_password' , onkeyup: 'disableregisterbutton()'  %>
      </div>
    </div>

<div class="row">

  <%= f.submit "Register" ,class:"btn btn-primary btn-merchant-reg",style:"float:right;margin-right:-90px;height:50px;width:150px;", id: "register"  %>

</div>

               

javascript代码片段在这里

**

<script>
    function disableregisterbutton() {
        var a = document.getElementById("confirm_password").value;
        var b = document.getElementById("password").value ;
        if (a == b){
            document.getElementById("register").disabled = false
        }else {
            document.getElementById("register").disabled = true
        }



    }
</script>

**

但是在这里，当密码不匹配时，注册按钮不会被禁用

Answer 1

您需要在默认情况下禁用提交按钮，并在更改确认密码值时应相应地禁用true或false。

                                           

    <div class="col-md-6">
      <div class="form-group form-merchant">
        <%= f.password_field :password_confirmation, class: "form-control inputs",placeholder:"Confirm Password" , required: true , id: 'confirm_password' , onkeyup: 'disableregisterbutton()'  %>
      </div>
    </div>

<div class="row">

  <%= f.submit "Register" ,class:"btn btn-primary btn-merchant-reg",style:"float:right;margin-right:-90px;height:50px;width:150px;", id: "register", disabled: true%>

</div



<script type="text/javascript">
    function disableregisterbutton() {
        //var a = $('#confirm_password').val();
        //var b = $("#password").val();
        //for javascript
        var a = document.getElementById("confirm_password").value;
        var b = document.getElementById("password").value ;
        if (a == b){
            //$("#register").prop('disabled', false);
            document.getElementById("register").prop('disabled', false);
        }else {
            //("#register").prop('disabled', true);
              document.getElementById("register").prop('disabled', true);
        }
    }
</script>