0

我正在尝试对简单的登录表单使用 javascript 验证。现在我只关注用户名输入（如果用户名已经被使用，希望它显示为红色并在其下方显示错误“该用户名已被使用”）。但是，即使当我检查元素网络时，输入更改时也没有显示任何内容，我看到它正在进入 registerjs.php 文件

在我的 html 表单页面的头部

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
    function valusername() {
    var username = $('input#username').val();
    if ($.trim(username) != '') {
        $.post('../ajax/registerjs.php', {username: username}, function(data) {
        if (data == 'That username is already taken') {

        document.getElementById("username").style.border="3px solid red";
        $('div#username_error').text(data);
    }

    });
    }
}

</script>

实际的文本输入是

<input class="input" type="text" tabindex="1" placeholder="Username*" 
style="height:20px;" name="username" id="username" onchange="valusername()">
<div id="username_error"></div>

链接的php文件registerjs.php我确定有效

<?php
include('../init.php');
if (isset($_POST['username']) === true && empty($_POST['username']) === false) {
$username = $_POST['username'];
if (user_exists($username) === true) {
echo("
    That username is already taken
    ");
} else {
echo("Good");
}
}
?>

有谁知道我为什么会遇到这个问题？它似乎是脚本中的 if 语句。

4

2 回答 2

2

做这个 ：

function valusername() 
{
    var username = $('input#username').val();
    if ($.trim(username) != '') 
    {
        $.post('../ajax/registerjs.php', {username: username}, function(data) 
        {
            if ($.trim(data) == 'That username is already taken') 
            {
                document.getElementById("username").style.border="3px solid red";
                $('div#username_error').text(data);
            }
        });
    }
}
于 2013-01-03T05:03:22.297 回答
1

更好的方法：

<input class="input" type="text" tabindex="1" placeholder="Username*" 
style="height:20px;" name="username" id="username" >
<div id="username_error"></div>

JS

<script>
    $(function(){
    $(document).on('change paste','#username', function () {
        var username = $(this).val();
        if ($.trim(username) !== '') {
            $.post('../ajax/registerjs.php', {username: username},
                function(data){
                    if (data) {
                        $("#username").css({'border','3px solid red'});
                        $('div#username_error').text('Username already exist');
                        return false;
                    }
                }
            ); // end of $.post
        } // end of if
    })
})
</script>

registerjs.php

<?php
include('../init.php');
// here i assume user_exists return true or false
if ( !empty($_POST['username']) && user_exists($username)) {
 return TRUE;
} 
else{
  return FALSE;
}
?>
于 2013-01-03T05:14:31.520 回答