ajax 验证唯一性

最新推荐文章于 2023-09-04 19:54:37 发布

yilukuangpao

最新推荐文章于 2023-09-04 19:54:37 发布

阅读量4k

点赞数 1

本文链接：https://blog.csdn.net/yilukuangpao/article/details/51619680

版权

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<form action="test.php" method="post" id="testForm">
    <table>
        <tr>
            <td>名字</td>
            <td><input type="text" id="username" οnblur="check_name()"/></td>
        </tr>
        <tr>
            <td></td>
            <td><input type="button" value="提交" οnclick="test()"/></td>
        </tr>
    </table>
</form>
</body>
</html>

<script>
   /* var flag=false;
    function check_name(){
        var username=document.getElementById('username').value;
        var ajax=new XMLHttpRequest();
        ajax.open('get','a.php?username='+username);
        ajax.send();
        ajax.onreadystatechange=function(){
            if(ajax.readyState==4 && ajax.status==200){
                if(ajax.responseText==1){
                    flag=true;
                }
            }
        }
        return flag;
    }

    function test(){
        if(check_name()){
            return true;
        }else{
            return false;
        }
    }*/

   /*function test(){
      var flag=true;
       var username=document.getElementById('username').value;
       var ajax=new XMLHttpRequest();
       ajax.open('get','a.php?username='+username,false);
       ajax.send();
       ajax.onreadystatechange=function(){
           if(ajax.readyState==4 && ajax.status==200){
               if(ajax.responseText==1){
                   flag=false;
               }
           }
       }
       return flag;
   }*/

   function check_name() {
       var username = document.getElementById('username').value;
       var ajax = new XMLHttpRequest();
       ajax.open('get', 'a.php?username=' + username);
       ajax.send();
       ajax.onreadystatechange = function () {
           if (ajax.readyState == 4 && ajax.status == 200) {
               if (ajax.responseText == 1) {
                   document.getElementById('testForm').submit();
               }
           }
       }
   }
   function test(){
       check_name();
   }

</script>

这是三中方案

1. 这种不太好，在提交时会先触发验证唯一性，再次按提交再可以提交

2.这是采用同步只有等ajax验证成功返回这时才会提交

3.这种是把提交放到了ajax回调函数中

综合以上：主要是要等到ajax验证成功后再提交

（如有错误，望各位指正，谢谢）