Jquery文本框验证[关闭]答案

【问题标题】：Jquery Textbox Validation [closed]Jquery文本框验证[关闭]
【发布时间】：2013-03-23 22:37:50
【问题描述】：

您好，我有一个没有操作按钮的文本框。在键入自身时，它必须验证它是否是从 A 到 z，如果不是，它会在文本框旁边抛出错误。我怎样才能做到这一点？

【问题讨论】：

签出这个..stackoverflow.com/questions/5241957/…
那不是我要找的那个。键入时的单个文本框必须做两件事：检查只输入了 a-z，如果没有，它必须在键入时抛出错误。
好的，我明白了，你会想要使用正则表达式......并结合它......
是的，你能帮我解决这个问题吗？它只能使用 jquery 来实现
不需要抛出错误可以吗？我们只是不允许他输入 A 到 Z 以外的字符

标签： jquery validation textbox

【解决方案1】：

给你！我已经把它简单化了，所以人们可以理解它的基本逻辑:)

这是我的 jsfiddle..

http://jsfiddle.net/joedf/mhVqr/2/

HTML

<input type='text' id='textbox'>
<input type="button" class="button-disabled" id="change" disabled="disabled" value="click">
<div id="throwEx"/>

$("#throwEx").hide();
$("#textbox").keyup(checkForm).focus(checkForm);

function checkForm() {
    var needle = /^([a-zA-Z0-9]+)$/;
    var inputVal = $("#textbox").val();

    if (inputVal == '') {
        $("#change").addClass("button-disabled").removeClass("button");
        $("#change").attr("disabled", "disabled");
        $("#throwEx").hide();
    }
    else if (!needle.test(inputVal)) {
        $("#change").addClass("button-disabled").removeClass("button");
        $("#change").attr("disabled", "disabled");
        $("#throwEx").text("Error: Only Alphanumeric characters are allowed...");
        $("#throwEx").show();
    } else {
        $("#change").removeClass("button-disabled").addClass("button");
        $("#change").removeAttr("disabled");
        $("#throwEx").hide();
    }
}

【讨论】：

【解决方案2】：

这可能对你有用：

<input type="text" class="abc">

也许你已经调整了正则表达式，但还没有真正测试过：

$(document).ready(function() {
$('.abc').bind('keyup', function() {
    regex = /^[A-z0-9]+$/;
    if(!regex.test($(this).val())) {
        $(this).next('.error').remove();
        $(this).after('<div class="error">Wrong</div>');
    } else {
       $(this).next('.error').remove();            
    }
}); 
});

小提琴：http://jsfiddle.net/EB6ET/2/

【讨论】：

这就是我正在寻找的东西......谢谢:)。你能单独更改上面代码的条件吗..1) 只接受 a 到 z 2) 只接受 0 到 9..

【解决方案3】：

我从 stackoverflow here 得到这个，并且只修改为输入字符 A 到 z。

<input type="text"/>

$(document).ready(function () {

$('input').keyup(function() {
    var $th = $(this);
    $th.val( $th.val().replace(/[^a-z]/g, function(str) { alert('You typed " ' + str + ' ".\n\nPlease use only letters and numbers.'); return ''; } ) );
});
});

小提琴here的链接

【讨论】：

【解决方案4】：

使用 keyup 函数控制 TextBox 是一个坏主意，因为用户可能会在 TextBox 内复制/粘贴文本或选择浏览器的自动完成字段之一等。我的方法：

LIVE JSFIDDLE

HTML：

<input type="text" id="TextBox1" name="TexBox1" value="" />
<span id='error' name='error'></span>

JS：

function monitor() {
    if ($('#TextBox1').val().length > 0) {
        var reg = /^([a-zA-Z]+)$/;
        if (!reg.test($('#TextBox1').val())) {
            $('#error').html("Only letters are allowed!");
        } else {
            $('#error').html("");
        }
    } else {
        $('#error').html("");
    }
}

var timer = '';

$('#TextBox1').on('focus', function () {
    timer = setInterval(monitor, 100);
}).on('blur', function () {
    clearInterval(timer);
});

【讨论】：