JQuery检查页面加载时输入是否为空

时间:2015-02-06 13:48:00

标签: javascript jquery html css

嘿,我有一个登录表单,当你点击输入时标签向上移动,在焦点输出后检查输入中是否有文字,如果标签没有关闭,标签是否保持不变。

我的代码是:

$(function () {
    $('.loginForm .inputGroup input').focusout(function () {
        var text_val = $(this).val();
        if (text_val === "") {
            $(this).removeClass('has-value');
        } else {
            $(this).addClass('has-value');
        }
    });
});

问题是当我点击登录时它会出现像用户名不存在的错误我想在输入上保留用户名,但是当我这样做时,标签会保留在输入文本的顶部。
如果输入中是否有文字,我如何检查加载?

帮助了解情况的图片:

enter image description here  enter image description here

的jsfiddle: http://jsfiddle.net/16g7yhLf/

干杯!

1 个答案:

答案 0 :(得分:6)

您可以在注册事件处理程序后触发focusout事件,以便处理程序将被执行。

$(function () {
    $('.loginForm .inputGroup input').focusout(function () {
        var text_val = $(this).val();
        if (text_val === "") {
            $(this).removeClass('has-value');
        } else {
            $(this).addClass('has-value');
        }
    }).focusout();//trigger the focusout event manually
});

演示:Fiddle


较短的版本可以是

$(function () {
    $('.loginForm .inputGroup input').focusout(function () {
        var text_val = $(this).val();
        $(this).toggleClass('has-value', text_val !== "");
    }).focusout(); //trigger the focusout event manually
});