Question

当var长度小于1时改变边框颜色？

............................................... .................................................. .................................................. ...............

http://jsfiddle.net/66chLg61/

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<script type="text/javascript">
$(window).load(function(){
$('#txt').keydown(function (e){
    if(e.keyCode == 13){
        var ex_se = $('#txt').val();
        var ex_se_lenght = ex_se.length;

        if(ex_se_lenght < '1')
            {
                // change border color id="txt" to red //
                alert('red');
            }
        else
            {
                // change border color id="txt" to black //
                alert('black');
            }
    }
})
});
</script>
<input type="text" id="txt"/>

Answer 1

试试这个：将$(window).laod更改为$(document).ready，然后将长度与字符串而不是整数进行比较，因此将if(ex_se_lenght < '1')更改为if(ex_se_lenght < 1)

注意 - 按下“ENTER”按钮后会看到警告，因为条件if(e.keyCode == 13)在那里。

代码：

$(document).ready(function(){
$('#txt').keydown(function (e){
    if(e.keyCode == 13)
    {
        var ex_se = $(this).val();
        var ex_se_lenght = ex_se.length;

        if(ex_se_lenght < 1)
            {
                // change border color id="txt" to red //
                alert('red');
            }
        else
            {
                // change border color id="txt" to black //
                alert('black');
            }
    }
})
});

<强> Demo

由@Danko添加，添加边框颜色在css类下创建并添加/删除红色边框

.alert {
    outline:none;
    border:2px solid red;
}

和JQuery：

if(ex_se_lenght < 1)
{
    $(this).addClass('alert');
    alert('red');
}
else
{
    $(this).removeClass('alert');
    alert('black');
}

<强> Demo By Danko

Answer 2

您可以这样做：

if(ex_se_lenght < '1')
{
    // change border color id="txt" to red //
    $("#txt").css('border-color', 'red');
    alert('red');
}
else
{
    // change border color id="txt" to black //
    $("#txt").css('border-color', 'black');
    alert('black');
}

Fiddle ...

编辑：错误的选择器......

Answer 3

像这样修改你的js：

$('#txt').keydown(function (e) {
    if (e.keyCode == 13) {
        var ex_se = $('#txt');
        var ex_se_lenght = ex_se.val().length;
        var color = ex_se_lenght < 1 ? 'red' : 'black';
        ex_se.css('border-color', color);
    }
});

演示： http://jsfiddle.net/lotusgodkk/66chLg61/11/

Answer 4

试

$(window).load(function () {
    $('#txt').keydown(function (e) {
        if (e.keyCode == 13) {
            var ex_se = $('#txt').val();
            var ex_se_lenght = ex_se.length;

            if (ex_se_lenght < '1') {
                // change border color id="txt" to red //
                $("#txt").removeClass("black").addClass("red");  // remove previous added class black

            } else {
                // change border color id="txt" to black //
                $("#txt").removeClass("red").addClass("black"); // remove previous added class red
            }
        }
    })
});

DEMO

var长度小于1时改变边框颜色？

4 个答案: