Question

的PHP / MySQL。我创建了一个包含用户名文本字段和按钮的简单表单。网页名称为 checkusername.php 。我也写了一个AJAX函数。然后我有另一个页面 usercheckpage.php ，其中checkusername.php的值通过AJAX函数getResult()传递。

在 usercheckpage.php 中，在数据库表中检查用户名，如果已存在，则显示'username not available'，如果可用，则显示'username available'。

但问题是，即使显示警告消息'username not available'，如果我单击提交按钮，该值也会传递到我的下一页 insertusername.php 。如果用户名不可用，我不希望表单被提交。我试过html5验证。但它并没有很好地运作。

这是我的代码：

checkusername.php

<form id="form1" name="form1" method="post" action="../controller/insertusername.php">
label for="txtuname"></label>
<input type="text" name="txtuname" id="txtuname" required onblur="getResult(this.value);" />
<span id="showusername"></span>
<input type="submit" name="submit" id="submit" value="SUBMIT" />
</form>

AjAX功能

function getResult(uname)
{  

    if(window.XMLHttpRequest)
    {  
        xmlhttp=new XMLHttpRequest();

        }
    else
    {
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }

    xmlhttp.onreadystatechange=function()//callback fn
        {   
          if(xmlhttp.readyState==4 && xmlhttp.status==200)
              {

                   document.getElementById('showusername').innerHTML=xmlhttp.responseText;

              }

                  xmlhttp.open("GET","checkusername.php?variable="+uname,true);
                  xmlhttp.send();

                  }

checkusername.php

<?php
include '../model/Query.php';
$un=$_GET["variable"];
$name="select username from login where username='".$un."'";
$res=getData($name);
while($row=mysqli_fetch_array($res))
{
    $name1=$row["username"];
} 
if($un==$name1)
{
    echo "name already exist";
}
else
{
    echo "ok";
}
?>

Answer 1

<强> HTML

添加提交活动

<form id="form1" name="form1" method="post" action="../controller/insertusername.php" onsubmit="checkUsername()">

<强> AJAX

修改你的getResult函数，以便返回true或false

if(xmlhttp.readyState==4 && xmlhttp.status==200){
    document.getElementById('showusername').innerHTML=xmlhttp.responseText;

    return (xmlhttp.responseText == 'ok') true : false;
}

然后创建一个非常简单的函数，onsubmit检查用户名是否可用。如果没有，请返回false，不会提交表单。

function checkUsername(){
    var username = document.getElementById("txtuname").value;
    if(!getResult(username))
        return false;
}

希望这会有所帮助： - ）

Answer 2

将其改为按钮

<input type="button" value="Submit" onclick="check()">

并添加方法

function check(){
    if(getElementById('showusername').innerHTML=="ok"){
        document.getElementById("form1").submit();
    }
}

我希望它有用......

Answer 3

HTML

添加提交活动

<form id="form1" name="form1" method="post" action="../controller/insertusername.php" onsubmit="checkUsername()">

AJAX

编辑你的getResult函数以返回true或false

if(xmlhttp.readyState==4 && xmlhttp.status==200){
    document.getElementById('showusername').innerHTML=xmlhttp.responseText;

    return (xmlhttp.responseText == 'ok') true : false;
}

然后创建一个非常简单的函数，即onsubmit检查用户名是否可用。如果没有，只返回false，表单将不会被提交。

function checkUsername(){
    var username = document.getElementById("txtuname").value;
    if(!getResult(username))
        return false;
}

AJAX用户名检查未验证

3 个答案: