在输入jquery中删除值时清除所有更改

I have a problem in Javascript It is when you delete the value of the field or change it the jquery effects still exist Is there a way to clear all the changes when i delete the value from input

我在Javascript中有问题当你删除字段的值或更改它时,jquery效果仍然存在当我从输入中删除值时有没有办法清除所有更改

this is example http://enjaz.tech/xlab/progress/ try type 6 in then type 2

这是示例http://enjaz.tech/xlab/progress/在类型2中尝试类型6

    $(document).ready(function() {
            $('#submit').click(function(e) {
            e.preventDefault();
           var pram = $('#getId').val()
            $.ajax({
                type: 'POST',
                url: 'call.php?q='+pram,
                success: function(data){

                    for(var i = 0 ; i < data ; i++){
                        var $steps = $('.amg-step');
                        if (i > 0) { $($steps[i - 1]).removeClass('--previous'); }
                        $($steps[i]).removeClass('--active').addClass('--complete').addClass('--previous');
                        if (i < $steps.length) { $($steps[i + 1]).addClass('--active'); }
                    }
                }
            });
        });
});

3 个解决方案

#1

When your input is empty, You need to clear out all the classes and then make only the first one active. Use below code

当您的输入为空时,您需要清除所有类,然后只激活第一个类。使用下面的代码

$('.amg-step').removeClass('--previous --complete --active'); //to clear all

$('.amg-step:eq(0)').addClass('--active'); // make first one active

Place this code just above your ajax call

将此代码放在ajax调用之上

#2

You need to reset all previously added classes:

您需要重置以前添加的所有类:

var $steps = $('.amg-step').removeClass('--previous').removeClass('--complete').removeClass('--active');

Or a shortened version of the ajax success function:

或者缩短版的ajax成功函数:

var $steps = $('.amg-step').removeClass('--previous --complete --active');
for(var i = 0 ; i < data ; i++){
    if (i > 0) { 
        $($steps[i - 1]).removeClass('--previous'); 
    }
    $($steps[i]).removeClass('--active').addClass('--complete').addClass('--previous');
    if (i < $steps.length) { $($steps[i + 1]).addClass('--active'); }
}

#3

You can set brand new class attribute

您可以设置全新的类属性

$('.amg-step').attr('class', 'amg-step');

#1