jQuery多个对象选择$（this）？

Question

我的表单上有三个输入字段，我已成功创建并仅限于三位数。然后，我想在更改时测试它们，它们小于255，如果没有将用户带回该字段再试一次。对于$（this）.select（），下面的代码是除了。选项。如何快速将用户带回到违规行为中？＆＃39;场？

            $(".colorField").change(function () {
            if (parseInt($(this).val(), 10) > 255) {
                $(this).select();
                //display error message
                $("#errmsg").html("Must be less than 255").show().fadeOut(2000);
            }
        });

Answer 1

您可以使用.focus()事件将焦点设置回输入。

此外，只需使用$(this).val().length即可获得输入值字符数。

这是一个有效的JSFiddle：
http://jsfiddle.net/3Qj7L/1/

HTML

<input type="text" class="colorField">
<div id="errmsg"></div>

JS

$(".colorField").change(function () {

    // Input value length should be less than 255 chars
    if ( $(this).val().length > 255 ) {
        // Set the focus back on the input
        $(this).focus();
        // Display error message
        $("#errmsg").html("Must be less than 255").show().fadeOut(2000);
    }
});

---

评论后编辑

这是一个新的jsFiddle，它检查用户的输入是否为数字，以及数字是否小于或等于255.如果它更高，它将自动将值替换为255.
http://jsfiddle.net/3Qj7L/2/

HTML

<input type="text" class="colorField" maxlength="3">

JS

// Check if the number is less than or equal to 255
$(".colorField").keyup( function(e) {

    if ( $(this).val() > 255 ) {
        e.preventDefault();
        $(this).val(255);
    }
});

// Only accepts numbers
$(".colorField").keypress( function(e) {

    if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
        return false;
    }
});