使用正则表达式限制文本框中的输入

时间:2017-06-07 16:13:04

标签: javascript jquery regex validation

  

/ ^ + {0,1}(?:\ d \ s?){11,13} $ /这个正则表达式仅允许+在第一位且只有数字...

on keypress我希望用户应该只能输入+和数字以上的正则表达式验证但是代码总是转到部分..为什么正则表达式在这种情况下不起作用

function ValidatePhone(phone) {
            var expr = /^\+?(?:\d\s?){11,13}$/;
            return expr.test(phone);
        }


var countofPlus = 0;

    $("#phone").on("keypress", function (evt) {
        if (evt.key == "+")
        {
            countofPlus = countofPlus + 1;
            if (countofPlus > 1 || this.value.length >= 1) {
                return false;
            }
            else return true;
        }
        var charCode = (evt.which) ? evt.which : event.keyCode
        if (charCode > 31 && charCode != 43 && charCode != 32 && charCode != 40 && charCode != 41 && (charCode < 48 || charCode > 57))
            return false;
        return true;
    });
$("#phone").on("keyup", function (evt) {
        debugger;
        if (evt.key == "+") {
            countofPlus--;
            return true;
        }

    });

2 个答案:

答案 0 :(得分:1)

使HTML input that takes only numbers and the + symbol的答案适应您的用例会产生以下(IE-)兼容代码:

&#13;
&#13;
// Apply filter to all inputs with data-filter:
var inputs = document.querySelectorAll('input[data-filter]');

for (var i = 0; i < inputs.length; i++) {
  var input = inputs[i];
  var state = {
    value: input.value,
    start: input.selectionStart,
    end: input.selectionEnd,
    pattern: RegExp('^' + input.dataset.filter + '$')
  };
  
  input.addEventListener('input', function(event) {
    if (state.pattern.test(input.value)) {
      state.value = input.value;
    } else {
      input.value = state.value;
      input.setSelectionRange(state.start, state.end);
    }
  });

  input.addEventListener('keydown', function(event) {
    state.start = input.selectionStart;
    state.end = input.selectionEnd;
  });
}
&#13;
<input id='tel' type='tel' data-filter='\+?\d{0,13}' placeholder='phone number'>
&#13;
&#13;
&#13;

以上代码需要复制&amp;将当前实现失败的地方考虑粘贴,选择,退回等。

此外,我将给定的正则表达式修改为\+?\d{0,13},因此它允许不完整的输入。使用HTML5表单验证来验证最终结果。

答案 1 :(得分:0)

我认为这个正则表达式只被应用于char代码,即长度为1的字符串。在这种情况下,regex将始终失败。

相反,请尝试对输入值运行正则表达式测试。