[javascript] 记录一次解决输入内容控制为 【半角英数字 + 限定符号】问题的过程

还是这个小网站项目，需要控制一个输入框的可输入内容，

在此记录一下编码过程。

需求：

　　可输入范围：

a-z
A-Z
0-9
-  // 短中横线
_  // 短下划线
.  // 点
‘  // 单引号

<input type=‘text‘ id=‘Target‘ maxlength=‘20‘ />

想法很简单，直接在oninput里用正则匹配替换掉不需要的字符，

$(function(){

    $(‘#Target‘).on(‘input‘, function(){
        $(this).val($(this).val().replace(/[^\w\-\_\.\‘]/ig, ""));
    }

});

是的没错就是这个正则式就可以

/[^\w\-\_\.\‘]/ig

\w 控制半角英数，（其实还有_)

剩下的是单个字符的控制，前面要加 \

检查下有没有问题：

IE9不行，直接没有限制。

=>IE9的话，需要在<input /> 标签里写，

<input type=‘text‘ id=‘Target‘ oninput=‘this.value = this.value.replace(/[^\w\-\_\.\‘]/ig, "")‘ />

等下，写法报错，因为有[        \‘         ]，引号问题。。。

解决办法：还是得用函数，

<input type=‘text‘ id=‘Target‘ oninput=‘onTargetInput(this)‘ />

var onTargetInput = function (el){
    el.value = el.value.replace(/[^\w\-\_\.\‘]/ig, "");
}

---- OK ! ----

原文地址：https://www.cnblogs.com/CoderMonkie/p/9262422.html