关于JS的length问题

是不是你html调用的方法不对？或者那个id不是一个文本框？

我能alert 出来。举个例子我能alert（$a.val()）出1234 但alert（$a.val().lenth）就是1

没有啊，我这边很正常，记住要先在文本框输入一些东西
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js"></script>
<input type="text" id="test"/>
<input type="button" value="检查" onclick="checkUserName('test')"/>
<script language="javascript" type="text/javascript">
function checkUserName(name) {
    var $a = $("#" + name);
alert($a.val());
alert($a.val().length);
    if ($a.val() == '' || $a == null || typeof $a === 'undefined') {
        $a.siblings('span').text("用户名不能为空").css("display", "inline-block");
    }
    else {
        if ($a.val().length < 5) {
            $a.siblings('span').text("用户名长度至少为5位").css("display", "inline-block");
        }
        else if ($a.val().length > 20) {
            $a.siblings('span').text("用户名长度至多为20位").css("display", "inline-block");
        }
        else {
            $a.siblings('span').text("用户名合法").css("display", "inline-block").css("color","green");
        }
    }
}</script>

难道我电脑快掉了。不会吧。。
$a.val() is undefined
[在此错误处中断] alert($a.val().length); 提示这个错误

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题页</title>
</head>
<body>
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js"></script>
<input type="text" id="test"/>
<input type="button" value="检查" onclick="checkUserName('test')"/>
<script language="javascript" type="text/javascript">
function checkUserName(name) {
    var $a = $("#" + name);
    alert($a.val());
    alert($a.val().length);
    if ($a.val() == '' || $a == null || typeof $a === 'undefined') {
        $a.siblings('span').text("用户名不能为空").css("display", "inline-block");
    }
    else {
        if ($a.val().length < 5) {
            $a.siblings('span').text("用户名长度至少为5位").css("display", "inline-block");
        }
        else if ($a.val().length > 20) {
            $a.siblings('span').text("用户名长度至多为20位").css("display", "inline-block");
        }
        else {
            $a.siblings('span').text("用户名合法").css("display", "inline-block").css("color","green");
        }
    }
}</script>
</body>
</html>

你用什么浏览器，我这边是chrome

我这是FF 奇怪了我的密码验证码都可以的但到了用户名就补可以$().ready(function () {
    focus('userName');
    //    focus('userPassword');
    //    focus('validate');
    //    checkUserName('userName');
       $("#userPassword").blur(function () {
        checkUserName('userPassword');
    });
    $("#userPassword").blur(function () {
        checkPassWord('userPassword');
    });
    $("#validate").blur(function () {
        checkEmail('validate');
    });});function focus(idName) {
    $("#" + idName).bind("focusin", function () {
        $(this).css("outline", "1px solid aqua");
    }).bind("blur", function () {
        $(this).css("outline", "0px solid aqua");
    });
}
function checkUserName(idName) {
    var $a = $("#" + idName);
    if ($a.val() == '' || $a == null || typeof $a === 'undefined') {
        $a.siblings('span').text("用户名不能为空").css("display", "inline-block");
    }
    else {
        if ($a.val().length < 5)
            $a.siblings('span').text("用户名不能少于5位").css("display", "inline-block");
        else if ($a.val().length > 20)
            $a.siblings('span').text("用户名不能至多5位").css("display", "inline-block");
        else {
            $a.siblings('span').text("用户名合法").css("display", "inline-block").css("color", "green");
        }
    }
}
function checkPassWord(idName) {
    var $b = $("#" + idName);
    if ($b.val() == '' || $b == null || typeof $b === 'undefined') {
        $b.siblings('span').text("密码不能为空").css("display", "inline-block");
    }
    else {
        if ($b.val().length < 5)
            $b.siblings('span').text("密码不能少于5位").css("display", "inline-block");
        else {
            $b.siblings('span').text("密码名合法").css("display", "inline-block").css("color", "green");
        }
    }
}
function checkEmail(idName) {
    var $c = $("#" + idName);
    if ($c.val() == '' || $c == null || typeof $c === 'undefined') {
        $c.siblings('span').text("验证码不能为空").css("display", "inline-block");
    }
    else {
        if ($c.val().toUpperCase() != GLOBAL.cookie.read('validate')) {
            $c.siblings('span').text("验证码不正确").css("display", "inline-block");
        } else {
            $c.siblings('span').text("验证码正确").css("display", "inline-block").css("color", "green"); ;
        }
    }
}

$().ready(function () {
    focus('userName');
    //    focus('userPassword');
    //    focus('validate');
    //    checkUserName('userName');
       $("#userName").blur(function () {
        checkUserName('userName');
    });
    $("#userPassword").blur(function () {
        checkPassWord('userPassword');
    });
    $("#validate").blur(function () {
        checkEmail('validate');
    });});

替换成我上面代码、、、你写了两边userPassword

这个我发的时候弄错了我改过来了还是
$a.val() is undefined
[在此错误处中断] if ($a.val().length < 5)

$().ready(function () {
    focus('userName');
    // focus('userPassword');
    // focus('validate');
    // checkUserName('userName');
//    $("#userName").blur(function () {
//        checkUserName('userName');
//    });
    $("#userPassword").blur(function () {
        checkPassWord('userPassword');
    });
    $("#validate").blur(function () {
        checkEmail('validate');
    });});function focus(idName) {
    $("#" + idName).bind("focus", function () {
        $(this).css("outline", "1px solid aqua");
    }).bind("blur", function () {
        $(this).css("outline", "0px solid aqua");
    });
}
//function checkUserName(idName) {
//    var $a = $("#" + idName);
//    if ($a.val() == '' || $a == null || typeof $a === 'undefined') {
//        $a.siblings('span').text("用户名不能为空").css("display", "inline-block");
//    }
//    else {
//        if ($a.val().length < 5)
//            $a.siblings('span').text("用户名不能少于5位").css("display", "inline-block");
//        else if ($a.val().length > 20)
//            $a.siblings('span').text("用户名不能至多5位").css("display", "inline-block");
//        else {
//            $a.siblings('span').text("用户名合法").css("display", "inline-block").css("color", "green");
//        }
//    }
//}
function checkPassWord(idName) {
    var $b = $("#" + idName);
    if ($b.val() == '' || $b == null || typeof $b === 'undefined') {
        $b.siblings('span').text("密码不能为空").css("display", "inline-block");
    }
    else {
        if ($b.val().length < 5)
            $b.siblings('span').text("密码不能少于5位").css("display", "inline-block");
        else {
            $b.siblings('span').text("密码名合法").css("display", "inline-block").css("color", "green");
        }
    }
}
function checkEmail(idName) {
    var $c = $("#" + idName);
    if ($c.val() == '' || $c == null || typeof $c === 'undefined') {
        $c.siblings('span').text("验证码不能为空").css("display", "inline-block");
    }
    else {
        if ($c.val().toUpperCase() != GLOBAL.cookie.read('validate')) {
            $c.siblings('span').text("验证码不正确").css("display", "inline-block");
        } else {
            $c.siblings('span').text("验证码正确").css("display", "inline-block").css("color", "green"); ;
        }
    }
} 把checkUserName 注释掉  密码和验证码可以的。。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
页面头部是这样的声明吗？你看我之前的例子没问题的

额我声明的是严格性的
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
1.1 xhtml的框架。。这有多大的关系么？

跟声明有关系？我3楼的代码就是一个完整的HTML文档，运行得很好

我把前后台都贴出来你们看下：
    <h2>
                用户登录</h2>
            <p>
                <label for="userName">
                    用户名：</label><input type="text" name="userName" id="userName" /><em>*</em><span>用户名不能为空</span>
            </p>
            <p>
                <label for="userPassword">
                    密码：</label><input type="password" name="userPassword" id="userPassword" /><em>*</em><span>密码不能为空</span>
            </p>
            <p>
                <label for="validate">
                    验证码：</label><input type="text" name="validate" id="validate" /><img src="/Validate/validata_code.aspx"
                        alt="验证码不区分大小写" onclick="this.src=this.src+'?'" /><em>*</em><span>验证码不正确</span>
            </p>
            <p>
                <label for="mLogin">
                    记住密码：</label><input type="checkbox" name="mLogin" id="mLogin" />2周内免登录
            </p>
$().ready(function () {
    focus('userName');
    // focus('userPassword');
    // focus('validate');
    // checkUserName('userName');
    $("#userName").blur(function () {
        checkUserName('userName');
    });
    $("#userPassword").blur(function () {
        checkPassWord('userPassword');
    });
    $("#validate").blur(function () {
        checkEmail('validate');
    });});function focus(idName) {
    $("#" + idName).bind("focus", function () {
        $(this).css("outline", "1px solid aqua");
    }).bind("blur", function () {
        $(this).css("outline", "0px solid aqua");
    });
}
function checkUserName(idName) {
    var $a = $("#" + idName);
    if ($a.val() == '' || $a == null || typeof $a === 'undefined') {
        $a.siblings('span').text("用户名不能为空").css("display", "inline-block");
    }
    else {
        if ($a.val().length < 5)
            $a.siblings('span').text("用户名不能少于5位").css("display", "inline-block");
        else if ($a.val().length > 20)
            $a.siblings('span').text("用户名不能至多5位").css("display", "inline-block");
        else {
            $a.siblings('span').text("用户名合法").css("display", "inline-block").css("color", "green");
        }
    }
}
function checkPassWord(idName) {
    var $b = $("#" + idName);
    if ($b.val() == '' || $b == null || typeof $b === 'undefined') {
        $b.siblings('span').text("密码不能为空").css("display", "inline-block");
    }
    else {
        if ($b.val().length < 5)
            $b.siblings('span').text("密码不能少于5位").css("display", "inline-block");
        else {
            $b.siblings('span').text("密码名合法").css("display", "inline-block").css("color", "green");
        }
    }
}
function checkEmail(idName) {
    var $c = $("#" + idName);
    if ($c.val() == '' || $c == null || typeof $c === 'undefined') {
        $c.siblings('span').text("验证码不能为空").css("display", "inline-block");
    }
    else {
        if ($c.val().toUpperCase() != GLOBAL.cookie.read('validate')) {
            $c.siblings('span').text("验证码不正确").css("display", "inline-block");
        } else {
            $c.siblings('span').text("验证码正确").css("display", "inline-block").css("color", "green"); ;
        }
    }
}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题页</title>
</head>
<body>
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js"></script>
<h2>
                用户登录</h2>
            <p>
                <label for="userName">
                    用户名：</label><input type="text" name="userName" id="userName" /><em>*</em><span>用户名不能为空</span>
            </p>
            <p>
                <label for="userPassword">
                    密码：</label><input type="password" name="userPassword" id="userPassword" /><em>*</em><span>密码不能为空</span>
            </p>
            <p>
                <label for="validate">
                    验证码：</label><input type="text" name="validate" id="validate" /><img src="/Validate/validata_code.aspx"
                        alt="验证码不区分大小写" onclick="this.src=this.src+'?'" /><em>*</em><span>验证码不正确</span>
            </p>
            <p>
                <label for="mLogin">
                    记住密码：</label><input type="checkbox" name="mLogin" id="mLogin" />2周内免登录
            </p>
<script language="javascript" type="text/javascript">
$().ready(function () {
    focus('userName');
    // focus('userPassword');
    // focus('validate');
    // checkUserName('userName');
    $("#userName").blur(function () {
        checkUserName('userName');
    });
    $("#userPassword").blur(function () {
        checkPassWord('userPassword');
    });
    $("#validate").blur(function () {
        checkEmail('validate');
    });});function focus(idName) {
    $("#" + idName).bind("focus", function () {
        $(this).css("outline", "1px solid aqua");
    }).bind("blur", function () {
        $(this).css("outline", "0px solid aqua");
    });
}
function checkUserName(idName) {
    var $a = $("#" + idName);
    if ($a.val() == '' || $a == null || typeof $a === 'undefined') {
        $a.siblings('span').text("用户名不能为空").css("display", "inline-block");
    }
    else {
        if ($a.val().length < 5)
            $a.siblings('span').text("用户名不能少于5位").css("display", "inline-block");
        else if ($a.val().length > 20)
            $a.siblings('span').text("用户名不能至多5位").css("display", "inline-block");
        else {
            $a.siblings('span').text("用户名合法").css("display", "inline-block").css("color", "green");
        }
    }
}
function checkPassWord(idName) {
    var $b = $("#" + idName);
    if ($b.val() == '' || $b == null || typeof $b === 'undefined') {
        $b.siblings('span').text("密码不能为空").css("display", "inline-block");
    }
    else {
        if ($b.val().length < 5)
            $b.siblings('span').text("密码不能少于5位").css("display", "inline-block");
        else {
            $b.siblings('span').text("密码名合法").css("display", "inline-block").css("color", "green");
        }
    }
}
function checkEmail(idName) {
    var $c = $("#" + idName);
    if ($c.val() == '' || $c == null || typeof $c === 'undefined') {
        $c.siblings('span').text("验证码不能为空").css("display", "inline-block");
    }
    else {
        if ($c.val().toUpperCase() != GLOBAL.cookie.read('validate')) {
            $c.siblings('span').text("验证码不正确").css("display", "inline-block");
        } else {
            $c.siblings('span').text("验证码正确").css("display", "inline-block").css("color", "green"); ;
        }
    }
}
</script>
</body>
</html>真的没问题
你试试~·

ff5.0 输入1234,alert 1234 4，完全正常<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js"></script>
    <h2>
                用户登录</h2>
            <p>
                <label for="userName">
                    用户名：</label><input type="text" name="userName" id="userName" /><em>*</em><span>用户名不能为空</span><input type="button" value="检查" onclick="checkUserName('userName')"/>
            </p>
            <p>
                <label for="userPassword">
                    密码：</label><input type="password" name="userPassword" id="userPassword" /><em>*</em><span>密码不能为空</span>
            </p>
            <p>
                <label for="validate">
                    验证码：</label><input type="text" name="validate" id="validate" /><img src="/Validate/validata_code.aspx"
                        alt="验证码不区分大小写" onclick="this.src=this.src+'?'" /><em>*</em><span>验证码不正确</span>
            </p>
            <p>
                <label for="mLogin">
                    记住密码：</label><input type="checkbox" name="mLogin" id="mLogin" />2周内免登录
            </p>
<input type="button" value="检查" onclick="checkUserName('test')"/>
<script language="javascript" type="text/javascript">
$().ready(function () {
    focus('userName');
    // focus('userPassword');
    // focus('validate');
    // checkUserName('userName');
    $("#userName").blur(function () {
        checkUserName('userName');
    });
    $("#userPassword").blur(function () {
        checkPassWord('userPassword');
    });
    $("#validate").blur(function () {
        checkEmail('validate');
    });});function focus(idName) {
    $("#" + idName).bind("focus", function () {
        $(this).css("outline", "1px solid aqua");
    }).bind("blur", function () {
        $(this).css("outline", "0px solid aqua");
    });
}
function checkUserName(idName) {
    var $a = $("#" + idName);
alert($a.val());
    alert($a.val().length);
    if ($a.val() == '' || $a == null || typeof $a === 'undefined') {
        $a.siblings('span').text("用户名不能为空").css("display", "inline-block");
    }
    else {
        if ($a.val().length < 5)
            $a.siblings('span').text("用户名不能少于5位").css("display", "inline-block");
        else if ($a.val().length > 20)
            $a.siblings('span').text("用户名不能至多5位").css("display", "inline-block");
        else {
            $a.siblings('span').text("用户名合法").css("display", "inline-block").css("color", "green");
        }
    }
}
function checkPassWord(idName) {
    var $b = $("#" + idName);
    if ($b.val() == '' || $b == null || typeof $b === 'undefined') {
        $b.siblings('span').text("密码不能为空").css("display", "inline-block");
    }
    else {
        if ($b.val().length < 5)
            $b.siblings('span').text("密码不能少于5位").css("display", "inline-block");
        else {
            $b.siblings('span').text("密码名合法").css("display", "inline-block").css("color", "green");
        }
    }
}
function checkEmail(idName) {
    var $c = $("#" + idName);
    if ($c.val() == '' || $c == null || typeof $c === 'undefined') {
        $c.siblings('span').text("验证码不能为空").css("display", "inline-block");
    }
    else {
        if ($c.val().toUpperCase() != GLOBAL.cookie.read('validate')) {
            $c.siblings('span').text("验证码不正确").css("display", "inline-block");
        } else {
            $c.siblings('span').text("验证码正确").css("display", "inline-block").css("color", "green"); ;
        }
    }
}
</script>

是不是你的浏览器缓存了什么东西？试下CTRL+F5强制刷新，或者清空缓存COOKIES什么的

我放在一起好像也没有问题。但分开放 JS 放在JS文件里面后
独独这一行出现问题 if ($a.val().length < 5)。
其他也没问题

ff5.0效果同19楼<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js"></script>
<script src="t.js"></script>
    <h2>
                用户登录</h2>
            <p>
                <label for="userName">
                    用户名：</label><input type="text" name="userName" id="userName" /><em>*</em><span>用户名不能为空</span><input type="button" value="检查" onclick="checkUserName('userName')"/>
            </p>
            <p>
                <label for="userPassword">
                    密码：</label><input type="password" name="userPassword" id="userPassword" /><em>*</em><span>密码不能为空</span>
            </p>
            <p>
                <label for="validate">
                    验证码：</label><input type="text" name="validate" id="validate" /><img src="/Validate/validata_code.aspx"
                        alt="验证码不区分大小写" onclick="this.src=this.src+'?'" /><em>*</em><span>验证码不正确</span>
            </p>
            <p>
                <label for="mLogin">
                    记住密码：</label><input type="checkbox" name="mLogin" id="mLogin" />2周内免登录
            </p>
<input type="button" value="检查" onclick="checkUserName('test')"/>
<script language="javascript" type="text/javascript">
</script>
t.js
$().ready(function () {
    focus('userName');
    // focus('userPassword');
    // focus('validate');
    // checkUserName('userName');
    $("#userName").blur(function () {
        checkUserName('userName');
    });
    $("#userPassword").blur(function () {
        checkPassWord('userPassword');
    });
    $("#validate").blur(function () {
        checkEmail('validate');
    });});function focus(idName) {
    $("#" + idName).bind("focus", function () {
        $(this).css("outline", "1px solid aqua");
    }).bind("blur", function () {
        $(this).css("outline", "0px solid aqua");
    });
}
function checkUserName(idName) {
    var $a = $("#" + idName);
alert($a.val());
    alert($a.val().length);
    if ($a.val() == '' || $a == null || typeof $a === 'undefined') {
        $a.siblings('span').text("用户名不能为空").css("display", "inline-block");
    }
    else {
        if ($a.val().length < 5)
            $a.siblings('span').text("用户名不能少于5位").css("display", "inline-block");
        else if ($a.val().length > 20)
            $a.siblings('span').text("用户名不能至多5位").css("display", "inline-block");
        else {
            $a.siblings('span').text("用户名合法").css("display", "inline-block").css("color", "green");
        }
    }
}
function checkPassWord(idName) {
    var $b = $("#" + idName);
    if ($b.val() == '' || $b == null || typeof $b === 'undefined') {
        $b.siblings('span').text("密码不能为空").css("display", "inline-block");
    }
    else {
        if ($b.val().length < 5)
            $b.siblings('span').text("密码不能少于5位").css("display", "inline-block");
        else {
            $b.siblings('span').text("密码名合法").css("display", "inline-block").css("color", "green");
        }
    }
}
function checkEmail(idName) {
    var $c = $("#" + idName);
    if ($c.val() == '' || $c == null || typeof $c === 'undefined') {
        $c.siblings('span').text("验证码不能为空").css("display", "inline-block");
    }
    else {
        if ($c.val().toUpperCase() != GLOBAL.cookie.read('validate')) {
            $c.siblings('span').text("验证码不正确").css("display", "inline-block");
        } else {
            $c.siblings('span').text("验证码正确").css("display", "inline-block").css("color", "green"); ;
        }
    }
}

22 楼的代码我粘贴到我的里面了。
失去焦点还是不行，但检查按钮可以
$a.val() is undefined
[在此错误处中断] alert($a.val().length);
还是老错误
难道我的电脑真出问题了

我这边去掉checkUserName两个alert()后
输入
1234 ，离开焦点，*用户名不能少于5位
12345 ，离开焦点，*用户名合法
123456789012345678901 ，离开焦点，*用户名不能至多5位楼主或者先去做点其他什么啥冷静下来再想想吧，另外你的缓存清空了没。

谢谢大家了。。我找到原因了。原来函数重名了。。
base层的JS 和common层的JS 函数重名了。

调试易

关于JS的length问题

解决方案 »