jquery - 检查输入字段的验证已更改

Question

我正在自定义我的代码。这是html

<div><input type="text" id="phone" /></div>
<div><input type="text" id="name" /></div>

jQuery

    function checkvalid(id){
        if(id == $('#phone')){
            if($('#phone').val() != ''){
                if(!$.isNumeric($('#phone').val())){
                    $('#phone').closest('div').append('<p id="text_phone" class="validate">Not a Valid Number</p>');
                    $('#phone').next('.validate').hide().fadeIn(2000);


                }}}
    }

    $('input').each(function(){
                $(this).change(function(){
                        var chkid = $(this).attr('id');
                        checkvalid(chkid);
                        //$(this).next('.validate').fadeToggle(2000);



                });
});

演示

但似乎无法使用更改功能....

Answer 1

尝试这个：

function checkvalid(id) {
    console.log(id);
    if (id == 'phone' && $('#phone').val() != '') {
        if (!$.isNumeric($('#phone').val())) {
            $('#phone').closest('div').append('<p id="text_phone" class="validate">Not a Valid Number</p>');
            $('#phone').next('.validate').hide().fadeIn(2000);
        } else {
            $('#phone').next('.validate').hide(1000);
        }
    }
}

$('input').change(function () {
    var chkid = $(this).attr('id');
    checkvalid(chkid);
    //$(this).next('.validate').fadeToggle(2000);
});

演示在这里

我改变了两件事：

• Use if (id == 'phone') {不是if(id == $('#phone')){
• 我简化.change()了你，不需要.each()

Answer 2

尝试这个

function checkvalid(id) {
    if (id == "phone" && $('#phone').val() != '') {
        if (!$.isNumeric($('#phone').val())) {
            alert("is not numeric");
            $('#phone').closest('div').append('<p id="text_phone" class="validate">Not a Valid Number</p>');
            $('#phone').next('.validate').hide().fadeIn(2000);
        }
    }
}


$('input').on('change', function () {
    var chkid = $(this).attr('id');
    checkvalid(chkid);
    //$(this).next('.validate').fadeToggle(2000);
});

我所做的更改

• id == 'phone'代替id == $('#phone')
• 不需要each，只需绑定输入
• 我已经用于on事件委托

演示