2012-10-06 89 views
0
echo "<form method='post' action='regprocess.php' id='registerform'>"; 
     echo '<fieldset class="register">'; 
     echo"<h2>Register</h2>"; 
      echo "<ul>"; 
        echo '<li><label for="FirstName">First Name: </label> <input type="text" name="FirstName" id="FirstName"></li>'; 
        echo '<li><label for="LastName">Last Name: </label> <input type="text" name="LastName" id="LastName"></li>'; 
        echo '<li><label for="Email">Email: </label><input type="email" name="Email" id="Email"></li>'; 
        echo '<li><label for="Username">Username: </label><input type="text" name="Username" id="Username"></li>'; 
        echo '<li><input type="button" id="check_username_availability" value="Check Availability"></li>'; 
        echo '<div id="username_availability_result"></div>'; 
        echo '<li><label for="Password">Password: </label><input type="password" name="Password" id="Password"></li>'; 
        echo '<li><input type="submit" value="Register"></li>'; 
        echo "</ul>"; 
     echo "</fieldset>"; 
     echo "</form>"; 
     } 
     $username = mysql_real_escape_string($_POST['Username']); 

//mysql query to select field username if it's equal to the username that we check ' 
$usernameresult = 'Select Username from User where Username = "'. $username .'"'; 
$uresult = $conn->query($usernameresult); 

//if number of rows fields is bigger them 0 that means it's NOT available ' 
if($uresult->num_rows==1) { 
    //and we send 0 to the ajax request 
    echo 0; 
}else{ 
    //else if it's not bigger then 0, then it's available ' 
    //and we send 1 to the ajax request 
    echo 1; 
} 
?> 
<script src="jquery-1.8.1.min.js" type="text/javascript"></script> 
<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT"> 
$(document).ready(function() { 

     var checking_html = 'Checking...'; 

     //when button is clicked 
     $('#check_username_availability').click(function(){ 
      //run the character number check 
      if($('#username').val().length < min_chars){ 
       $('#username_availability_result').html(checking_html); 
       check_availability(); 
      } 
     }); 

    }); 

//function to check username availability 
function check_availability(){ 

     //get the username 
     var username = $('#username').val(); 

     //use ajax to run the check 
     $.post("check_username.php", { username: username }, 
      function(result){ 
       //if the result is 1 
       if(result == 1){ 
        //show that the username is available 
        $('#username_availability_result').html(username + ' is Available'); 
       }else{ 
        //show that the username is NOT available 
        $('#username_availability_result').html(username + ' is not Available'); 
       } 
     }); 

} 
</script> 

大家好,所以我试图做一个窗体,将验证如果有一个用户名可用在我的数据库。我以前使用过JavaScript,但我没有用Ajax和JQuery做过很多。我一直在控制台中看到这条错误消息,内容为 ReferenceError:找不到变量:$ 对此脚本行作出反应 $(document).ready(function(){
我不确定为什么,我只是想知道是否有人可以给我一些见解如何解决它?谢谢试图实现jquery/ajax到html页面

+1

您确定jquery-1.8.1.min.js与您正在运行的脚本位于相同的文件夹中吗? –

+0

毫米它绝对是。但我刚刚得到这个其他错误消息无法加载资源:服务器响应状态为404(未找到)从jquery文件中,我真的不知道它是什么关于.. – courtney

+0

这意味着jquery-1.8 .1.min.js与您正在运行的脚本不在同一个文件夹中。仔细检查它的位置。 –

回答

3

该代码似乎okay.Only问题,我认为你对jQuery库的引用是不对的。请参阅源代码,然后单击在jquery库中包含一行,以测试路径是否正常。将jquery-1.8.1.min.js保留在这些php文件所在的文件夹中,或使用任何CDN文件夹,如

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> 

希望它有帮助!

+0

我在该代码中添加了它,它似乎解决了我的问题,谢谢!但我每次点击检查可用性按钮TypeError:'undefined'不是一个对象(评估'$('#username')。val()。length') – courtney

+3

courtney - html id属性是大小写的,敏感。尝试将“#username”更改为“#Username”。 – joadha

+0

不客气!我认为joadha已经提到了上面的解决方案。用“#Username”替换“#username”.. –