Question

我使用jQuery替换功能来确保用户只能在电话号码字段中输入数字和连字符（它是一个私人网络应用程序，并且必须启用JS才能登录）。

我想在触发替换函数后将xss类（突出显示为红色）添加到输入x秒，以便用户可视地看到输入拒绝输入。

如何在激活替换功能后将css类添加到输入x秒？（仅在实际替换输入时）

$("#v_phone").bind('keyup blur',function(){ 
    $(this).val( $(this).val().replace(/[^\d-]/g,'') ); }
);

Answer 1

使用setTimeout()：

$("#v_phone").bind('keyup blur',function(){ 
    var $this = $(this);
    var currentValue = $this.val();
    var newValue = currentValue.replace(/[^\d-]/g,'');
    if (currentValue != newValue) {
       $this.val(newValue);
       $this.addClass("alert");  // add class
       var x = 5;
       setTimeout(function () {
         $this.removeClass("alert");  // remove class after x seconds
       }, x * 1000);
    }
});

<强> DEMO

Answer 2

replace()是原生JavaScript，而不是jQuery。您可以先测试表达式，然后查看是否需要替换，然后触发该类：

var reg = /[^\d-]/g;

$("#v_phone").bind('keyup blur',function() { 
    var $this = $(this);
    if( reg.test(this.value) ) {
        $this.addClass('highlight');
        setTimeout(function() {
            $this.removeClass('highlight');
        },1000); // 1s
        $this.val( this.value.replace(reg,'') );
    }
});

http://jsfiddle.net/HvGnf/

jQuery - 检测何时替换＆＃39;功能执行动作

2 个答案: