HTML中限制input 输入框输入内容及onkeyup的多个判断过滤

onkeyup的多个判断过滤

onkeyup="this.value=this.value.replace(/[过滤内容1]/g,',').replace(/[过滤内容2]/g,'&').replace(/[过滤内容3]/g,'-').replace(/[过滤内容3]/g,'(').replace(/[过滤内容4]/g,')')"

复制代码

限制 input 输入框只能输入纯数字

onkeyup = "value=value.replace(/[^\d]/g,'')"

复制代码

使用 onkeyup 事件，有 bug ，那就是在中文输入法状态下，输入汉字之后直接回车，会直接输入字母

onchange = "value=value.replace(/[^\d]/g,'')"

复制代码

使用 onchange 事件，在输入内容后，只有 input 丧失焦点时才会得到结果，不能在输入时就即时做出响应

oninput = "value=value.replace(/[^\d]/g,'')"

复制代码

不允许粘贴赋值

<input onpaste="return false;" type="text" name="textfield" value="">

复制代码

其他正则整理：
输入大小写字母、数字、下划线：

<input type="text" οnkeyup="this.value=this.value.replace(/[^\w_]/g,'');">

复制代码

输入小写字母、数字、下划线：

<input type="text" οnkeyup="this.value=this.value.replace(/[^a-z0-9_]/g,'');">

复制代码

输入数字和点:

<input type="text" οnkeyup="value=value.replace(/[^\d.]/g,'')">

复制代码

输入中文:

<input type="text" οnkeyup="this.value=this.value.replace(/[^\u4e00-\u9fa5]/g,'')">

复制代码

输入数字:

<input type="text" οnkeyup="this.value=this.value.replace(/\D/g,'')">

复制代码

输入英文:

<input type="text" οnkeyup="this.value=this.value.replace(/[^a-zA-Z]/g,'')">

复制代码

输入中文、数字、英文:

<input οnkeyup="value=value.replace(/[^\w\u4E00-\u9FA5]/g, '')">

复制代码

文本框只能输入数字代码(小数点也不能输入)

<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')">

复制代码

输入数字和字母：

<input onKeyUp="value=value.replace(/[^\d|chun]/g,'')">

复制代码

除了英文的标点符号以外，其他的都可以中文，英文字母，数字，中文标点

<input type="text" οnkeyup="this.value=this.value.replace(/^[^!@#$%^&*()-=+]/g,'')">

复制代码

只能输入数字代码(小数点也不能输入)

<input οnkeyup="this.value=this.value.replace(/\D/g,'')">

复制代码

只能输入数字,能输小数点

<input οnkeyup="if(isNaN(value))execCommand('undo')">
<input name=txt1 οnchange="if(/\D/.test(this.value)){alert('只能输入数字');this.value='';}">

复制代码

数字和小数点方法二

<input type=text t_value="" o_value="" οnkeypress="if(!this.value.match(/^[\+\-]?\d*?\.?\d*?$/))this.value=this.t_value;else this.t_value=this.value;if(this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?)?$/))this.o_value=this.value" οnkeyup="if(!this.value.match(/^[\+\-]?\d*?\.?\d*?$/))this.value=this.t_value;else this.t_value=this.value;if(this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?)?$/))this.o_value=this.value" οnblur="if(!this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?|\.\d*?)?$/))this.value=this.o_value;else{if(this.value.match(/^\.\d+$/))this.value=0+this.value;if(this.value.match(/^\.$/))this.value=0;this.o_value=this.value}">

复制代码

只能输入字母和汉字

<input οnkeyup="value=value.replace(/[\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[\d]/g,''))" maxlength=10 name="Numbers">

复制代码

只能输入英文字母和数字,不能输入中文

<input οnkeyup="value=value.replace(/[^\w\.\/]/ig,'')">

复制代码

只能输入数字和英文

<input onKeyUp="value=value.replace(/[^\d|chun]/g,'')">

复制代码

小数点后只能有最多两位(数字,中文都可输入),不能输入字母和运算符号:

<input onKeyPress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 || /\.\d\d$/.test(value))event.returnValue=false">

复制代码

小数点后只能有最多两位(数字,字母,中文都可输入),可以输入运算符号:

<input οnkeyup="this.value=this.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')">

复制代码

JS判断只能是数字和小数点

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>input正则表达式</title>
</head>
<body>
<div>
<form onsubmit="return chkIt(this)">
<input name="phone">
<input name="n2">
<input name="smt" type="submit" value="提交">
</form>
</div>
<script type="text/javascript">
function chkIt(frm) {
if (frm.phone.value.length > 0 && frm.phone.value.match(/[\x01-\xFF]*/) == false) {
alert('phone不能输入中文！')
frm.phone.focus();
return false;
}
}
</script>
</body>
</html>

复制代码

相关阅读：
【实测】使用label方式实现点击input内的文字选中checkbox radio按钮
 【原创】Discuz去除输入框自动去除https://和http://以及/的方法，input用户输入网址自动去除https://和http://以及/的方法
 【原创】关于input表单的一些常用属性，强制数字，强制填写，强制中文，未填写无法提交等属性
 【实测】input默认文字两种方法，添加提示文字，填写内容时消失及给input文本框中添加灰色提示字

		自动登录	找回密码
密码			立即注册

HTML中限制input 输入框输入内容及onkeyup的多个判断过滤-Discuz教程下载

HTML中限制input 输入框输入内容及onkeyup的多个判断过滤

相关帖子

全部评论 0

最佳新人

管理/版主

土豪装逼

教程 / CSS+DIV素材

【实测】Discuz修改论坛列表页排序，实现主题帖子按最新发表时间73人阅读

Discuz! X3.2 - X3.4 升级至 Discuz! X3.5 详细教程80人阅读

【原创】根据论坛发帖时间或门户文章发布时间，判断时间是否为当95人阅读

非手动网站版权年份自动更新代码86人阅读

【收集整理】兔源码简单收集整理关于网页上各meta标签说明83人阅读

【原创】分享一款html5+css3的浮窗多图DIY模块（百分百有效）52人阅读

【原创】分享一款html5+css3的浮窗单图DIY模块（百分百有效）48人阅读

【原创】分享一款html5+css3的横排导航列表DIY模块（百分百有效82人阅读

【原创】分享一款html5+css3的四排图文资讯列表DIY模块（百分百252人阅读

【转载】垂直时光轴HTML单页+CSS+js模块927人阅读

所属版块