input 输入 限制 大全

简介: input 输入 限制 大全

1、只能输入数字

<el-input   onkeyup="value=value.replace(/[^\d]/g,'')"></el-input>

中能输入金额 保留两位小数

<el-input type="number"  onkeyup="value=(value*1).toFixed(2)"><el-input>

2、JS控制不能输入空格

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

3、JS 控制不能输入特殊字符和中文

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

4、JS 控制文本框只能输入数字

<input type="text" οnkeyup="value=value.replace(/[^0-9]/g,'')" οnpaste="value=value.replace(/[^0-9]/g,'')" oncontextmenu = "value=value.replace(/[^0-9]/g,'')">

5、JS 控制文本框只能输入数字、小数点

<input οnkeyup="value=value.replace(/[^\0-9\.]/g,'')" οnpaste="value=value.replace(/[^\0-9\.]/g,'')" oncontextmenu = "value=value.replace(/[^\0-9\.]/g,'')">

6、JS 控制文本框只能输入英文

<input οnkeyup="value=value.replace(/[^\a-\z\A-\Z]/g,'')" οnpaste="value=value.replace(/[^\a-\z\A-\Z]/g,'')" oncontextmenu = "value=value.replace(/[^\a-\z\A-\Z]/g,'')">

7、JS 控制文本框只能输入英文、数字

<input οnkeyup="value=value.replace(/[^\a-\z\A-\Z0-9]/g,'')" οnpaste="value=value.replace(/[^\a-\z\A-\Z0-9]/g,'')" oncontextmenu = "value=value.replace(/[^\a-\z\A-\Z0-9]/g,'')">

8、JS 控制文本框只能输入中文

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

9、JS 控制文本框只能输入中文、英文、数字

<input οnkeyup="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,'')" οnpaste="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,'')" oncontextmenu = "value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,'')">

10、JS 控制文本框只能输入中文、英文、数字、空格

<input οnkeyup="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5\ ]/g,'')" οnpaste="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5\ ]/g,'')" oncontextmenu = "value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5\ ]/g,'')">

11、JS 控制文本框只能输入中文、英文、数字、小数点

<input οnkeyup="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5\.]/g,'')" οnpaste="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5\.]/g,'')" oncontextmenu = "value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5\.]/g,'')">

12、输入之后立即清除:

//验证输入框内不能输入特殊字符,输入就立刻清除
   function cleanSpelChar(th){     
      if(/["'<>%;)(&+]/.test(th.value)){           
      $(th).val(th.value.replace(/["'<>%;)(&+]/,""));     
      } 
  }

13、如果是特殊字符,禁止输入:

//验证输入框内不能输入特殊字符,输入前先作判断
function processSpelChar() {
    var code;
    var character;
    if (document.all) {
        code = window.event.keyCode;
    } else {
        code = arguments.callee.caller.arguments[0].which;
    }
    var character = String.fromCharCode(code);
    var txt = new RegExp(/["'<>%;)(&+]/);
    if (txt.test(character)) {
        if (document.all) {
            window.event.returnValue = false;
        } else {
            arguments.callee.caller.arguments[0].preventDefault();
        }
    }
}

14、JS替换英文特殊字符 `~!@#$%^&*()_±=;':"|,./<>?

var subject= document.getElementById("subject").value;
subject = subject.replace(/[\-\_\,\.\!\|\~\`\(\)\#\@\%\-\+\=\/\'\$\%\^\&\*\{\}\:\;\"\L\<\>\?\\]/g, ''); 
alert(subject);

15、金额输入限制 只能输入数字和小数点

只需要设置 type=‘digit’ 即可

<input type='digit' class='n-input' placeholder='请输入充值金额' bindinput="inputedit" adjust-position="true" value="{{moneyNum}}"/>

收集中…

扫码获取 1000+条 前端面试题 收藏以后面试用得上

给大家推荐一个实用面试题库

1、前端面试题库 (面试必备) 推荐:★★★★★

地址:前端面试题库

相关文章
element-plus:el-date-picker日期只选择年月不要日
element-plus:el-date-picker日期只选择年月不要日
1470 0
|
4月前
|
数据采集 搜索推荐 JavaScript
302重定向:临时改道的艺术与陷阱何时该用,何时该避?
HTTP 302重定向是一种临时性地址变更机制,适用于短期、可逆的场景。与永久重定向301不同,302不会将旧URL的权重传递给新URL,搜索引擎会继续索引原始页面。常见用途包括A/B测试、限时促销、服务器维护和登录跳转等。使用302时需注意设定明确的时间范围,避免误用于永久变更,并定期监控重定向状态,防止SEO权重流失或用户体验混乱。正确使用302有助于在不损害SEO表现的前提下灵活应对网站变动需求。
373 2
|
移动开发 JavaScript HTML5
el-input限制输入整数等分析
本文介绍了在Vue中限制el-input只能输入整数的几种方式,包括设置type为number,使用inputmode属性,自定义指令,计算属性,使用onafterpaste和onkeyup事件以及使用el-input-number的precision属性。每种方式都有其优缺点,可以根据实际需求选择合适的方式。比较建议用自定义指令的方式来实现。
2428 0
el-input限制输入整数等分析
|
12月前
|
API C#
在.NET中使用QuestPDF高效地生成PDF文档
在.NET中使用QuestPDF高效地生成PDF文档
317 0
|
消息中间件 存储 Java
RabbitMQ之延迟队列(手把手教你学习延迟队列)
【1月更文挑战第12天】延时队列,队列内部是有序的,最重要的特性就体现在它的延时属性上,延时队列中的元素是希望在指定时间到了以后或之前取出和处理,简单来说,延时队列就是用来存放需要在指定时间被处理的元素的队列的。
5027 100
Element - ui :el-input 输入只能是数字并且小数点后只能是1-2位
Element - ui :el-input 输入只能是数字并且小数点后只能是1-2位
5241 1
element el-table 设置fixed导致行错乱问题
文章讨论了在使用Element UI的`el-table`组件时,设置固定列(`fixed`)导致行错乱的问题,并提供了解决方案。问题产生的原因是当表格底部有滚动条而固定列底部没有滚动条时,行无法对齐。解决办法是在表格中设置`padding-bottom`的内边距与滚动条高度相等,确保固定列和非固定列的行能够对齐。
3407 0
|
开发框架 JavaScript 前端开发
在Vue前端界面中,几种数据表格的展示处理,以及表格编辑录入处理操作。
在Vue前端界面中,几种数据表格的展示处理,以及表格编辑录入处理操作。