Question

我的jsp中有一个id为countryCode的文本字段，用于输入电话号码的国家/地区代码。用户应该能够输入国家代码作为前缀为+号的数字或数字。例如：91或+91或1或+1等。请建议一个jquery函数来限制用户输入时的i / p，只接受这种模式。

尝试使用以下代码。

$('input[id="countryCode"]').bind('keypress', function (event) {
        var regex = new RegExp("^[+0-9\b]+$");
        var str= $( "#countryCode" ).val();
        var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
        if (!regex.test(key) || (key=="+" && str.length>0)) {
            event.preventDefault();
            return false;
        }
    });

但是在输入91之后，我无法输入+作为第一个字符

Answer 1

您需要比较输入的字符及其位置，以确定它是否有效。如果文本框中已有内容并且用户尝试在第一个位置键入(key=="+" && str.length>0)，则检查+就会失败。

工作小提琴：http://jsfiddle.net/kjw2j9as/2/。

HTML：

<input id="countryCode" type="text">

使用Javascript：

$('input[id="countryCode"]').bind('keypress', function (event) {
    var regex = new RegExp("^[+0-9\b]+$");
    var str= $( "#countryCode" ).val();
    var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
    if (!regex.test(key)){
        event.preventDefault();
        return false;
    }
    else if (str.length > 0) {
        if (key == "+" && $(this).getCursorPosition() != 0){
            event.preventDefault();
            return false;
        }
    }
});

// Borrowed from: http://www.fourthbottle.com/2014/03/how-to-get-cursor-position-in-textbox.html
 $.fn.getCursorPosition = function () {
    var pos = 0;
    var el = $(this).get(0);
    // IE Support
    if (document.selection) {
        el.focus();
        var Sel = document.selection.createRange();
        var SelLength = document.selection.createRange().text.length;
        Sel.moveStart('character', -el.value.length);
        pos = Sel.text.length - SelLength;
    }
    // Firefox support
    else if (el.selectionStart || el.selectionStart == '0')
        pos = el.selectionStart;
    return pos;
}

限制文本字段中的用户输入以确认模式

1 个答案: