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 };