在ajax验证中调用javascript

calling javascript in ajax validation

本文关键字：调用 javascript 验证 ajax      更新时间：2023-09-26

我有两个密码输入字段：

<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>

该代码不进行验证

我不知道为什么需要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");
    }     
  });      
});

这是一个工作样品。

编辑：根据OP的评论

您的验证没有启动的原因是因为两个问题。

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");
      }
    });      
});

这是一个工作样本。

相关文章：