JS简单实用小功能（一）

一、过滤字符串两边空格

 

1 <input type='text' id='strs' value='    需要过滤两边的空格    '>
2 <input type='button' id='rstrsBtn' value=' 过滤 '>

 

    window.onload = function(){
        var _rstrsBtn = document.getElementById("rstrsBtn"),            //获取过滤按钮对象
                _strs = document.getElementById("strs");            //获取被过滤元素

        _rstrsBtn. onclick = function(){//去除空格
            _strs.value = _strs.value.replace( /^(\s|\u00A0)+|(\s|\u00A0)+$/g, "" );//正则替换
        }
    };

二、验证是否输入

<input type='text' id='strs' value='    需要过滤两边空格    '>
<input type='button' id='isContent' value='验证是否为空'><br>

 1    window.onload = function(){
 2         var _isContent = document.getElementById("isContent"),
 3                 _strs = document.getElementById("strs");
 4         _isContent.onclick = function(){
 5             if(!_strs.value.replace( /^(\s|\u00A0)+|(\s|\u00A0)+$/g, "" )){
 6                 alert("您的输入为空！");
 7             }else{
 8                 alert("您的输入不为空！");
 9             }
10         }
11     };

三、禁止复制粘贴

1 <input type="text" name="banCopyPaste"  id='banCopyPaste'/><br>

1     var banCopyPaste = document.getElementById("banCopyPaste");
2     banCopyPaste.oncopy = function(){        //禁止复制事件
3         return false;
4     }
5     banCopyPaste.onpaste = function(){        //禁止粘贴
6         return false;
7     }

四、限制输入（数字）

1 <form>
2     <input type="number" name="numberHtml5"  value='html5只能输入数字' id='banNumberHtml5'/><br>
3     <input type="text" value='html5只能输入数字'  pattern=[0-9] id='patternHtml5'/>
4     <input type="text" name="number"  value='只能输入数字' id='banNumber'/><br>
5     <input type='submit' value='提交'>
6 form>

 1     window.onload = function(){
 2         var banNumber = document.getElementById("banNumber"),
 3                 clearNonumber = function(tThis){        //过滤数字
 4                     var _v = tThis.value;
 5                     tThis.value = _v.replace(/\D/g,"");
 6                 }
 7         banNumber.onfocus = function(){            //绑定获取焦点事件
 8             clearNonumber(this);
 9         }
10         banNumber.onkeyup = function(){            //绑定键盘事件
11             clearNonumber(this);
12         }
13         banNumber.onblur = function(){                //失去焦点事件
14             clearNonumber(this);
15         }
16     };

五、限制输入（中文）

1 <input type="text" name="number"  value='只能输入中文' id='chineseStr'/><br>

 1     window.onload = function(){
 2         var chineseStr = document.getElementById("chineseStr"),
 3                 clearNonumber = function(tThis){                    //过滤字符
 4                     var _v = tThis.value;
 5                     tThis.value = _v.replace(/[^\u4e00-\u9fa5]/g,"");    //正则替换
 6                 }
 7         chineseStr.onfocus = function(){                            //获取焦点事件
 8             clearNonumber(this);
 9         }
10 
11         chineseStr.onkeyup = function(){                            //键盘事件
12             clearNonumber(this);
13         }
14         chineseStr.onblur = function(){                            //失去焦点事件
15             clearNonumber(this);
16         }
17     };

 

转载于:https://www.cnblogs.com/HopeInTheDark/p/11433672.html