Question

我有两个密码输入字段：

<input class="form-control" type="password" name=password placeholder="Password"/>

和

<input class="form-control" type="password" id="button" placeholder="Confirm Password" onblur=";"/>

我想使用ajax验证密码是否相同，如果它们没有直接显示错误输入字段，如果不是我想调用一个javascript函数，它将生成密码的哈希值（我有一个javascript为此准备的函数，我只需要函数叫）

这是我到目前为止所拥有的：

$(function() {
    $("#create_user").click(function(e)) {
      e.preventDefault();
      var password = $("#password-input").val(); 
      var password_confirm = $("#password-confirm-input").val();
      if (!password.length || password != password_confirm ) {
        $("#label").html("Passwords do not match");
      }

    }
  });

这是我的HTML代码的一部分：

<form id="myform" action="add_user.php" method="POST">
        <div class="form-group">
          <input class="form-control" type="text" id="username" name="username" placeholder="Username"/>
        </div>
        <div class="form-group">
          <input class="form-control" type="password" id="password-input" name="password" placeholder="Password"/>
        </div>
        <div class="form-group">
          <input class="form-control" type="password" id="password-confirm-input" placeholder="Confirm Password" onblur=";"/>
        </div>
        <div class="form-group">
          <input class="form-control" type="text" placeholder="User Type"/>
        </div>
        <div class="form-group" id="msg">
          <input class="form-control" type="text" name=email placeholder="E-mail Address"/>
          <label id="label" for="male">Male</label>
        </div>
        <br>
        <div class="form-group pull-right">
          <input class="btn btn-success" id="create_user" value="Create User"/>
          <input class="btn btn-success" type="submit" id="create_user2" value="Create User"/>
        </div>

此代码不进行验证

Answer 1

我不确定为什么你需要ajax来比较密码。你可以在javascript中做到这一点。

假设password和password2是文本框的Id值，save是按钮的Id值，点击该值将触发比较。

$(function(){

  $("#save").click(function(e){
    e.preventDefault();
    var p1=$("#password").val();
    var p2=$("#password2").val();
    $("#msg").html("");
    if(p1!==p2)
    {
        $("#msg").html("Passwords do not match");
    }     
  });      

});

Here是一个工作样本。

编辑：根据OP的评论

您的验证未被解雇的原因是2个问题。

1）jquery点击事件已注册到ID为create_user（#create_user）的元素，但在HTML标记中，您的按钮的ID为create_user2

2）这里有语法错误。您正在关闭该功能（在e之后），您不应该这样做。

$("#create_user").click(function(e)) {

因此，解决方案是更正您的js代码以使用正确的按钮ID并修复语法错误。

$(function(){      

   $("#create_user2").click(function(e) {

      e.preventDefault();
      var password = $("#password-input").val(); 
      var password_confirm = $("#password-confirm-input").val();

      $("#label").html("");
      if (!password.length || password != password_confirm ) {
        $("#label").html("Passwords do not match");
      }

    });      

});

Here是一个工作样本。

在ajax验证中调用javascript

1 个答案: