脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → javaScript限制文本框的输入内容代码

js限制文本框的输入内容代码分享（3类）

 更新时间：2015年08月20日 17:04:59   投稿：lijiao  
这篇文章主要介绍了3类js限制文本框的输入内容代码,需要的朋友可以参考下

为大家分享的JavaScript限制文本框的输入内容代码如下

<style type="text/css">
<!--
.STYLE1 {
 color: #0099FF;
 font-weight: bold;
 font-size: x-large;
}
-->
</style>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p align="center" class="STYLE1">亲，试试效果吧！</p>
<p align="center"><strong>请输入数字或字母</strong>：
 <input onkeyup="value=value.replace(/[\W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))">
</p>
<p align="center"><strong>请输入数字，只能输入数字哦</strong>：
 <input onkeyup="value=value.replace(/[^\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))">
</p>
<p align="center"><strong>请输入汉字，只能输入汉字哦</strong>：
 <input onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\u4E00-\u9FA5]/g,''))">
</p>

运行效果图：

下面再给大家补充一些：

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

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

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

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

其实还可以限制其他内容，比如只能是字母，大家可以尝试一些其他的。

以上就是为大家分享的JavaScript限制文本框的输入内容代码

您可能感兴趣的文章:

相关文章

  • Bootstrap基本插件学习笔记之折叠(22)

    Bootstrap基本插件学习笔记之折叠(22)

    这篇文章主要为大家详细介绍了Bootstrap基本插件学习笔记之折叠的相关资料,具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2016-12-12
  • 详解GoJs节点的选中高亮实现示例

    详解GoJs节点的选中高亮实现示例

    这篇文章主要为大家介绍了GoJs节点的选中高亮实现示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
    2023-05-05
  • JavaScript EventEmitter 背后的秘密 完整版

    JavaScript EventEmitter 背后的秘密 完整版

    在这里，我们的目标创建属于我们自己的 Event Emitter 去理解背后的秘密。所以，让我们看一下下面的代码是怎么工作的,需要的朋友可以参考下
    2018-03-03
  • select2 ajax 设置默认值,初始值的方法

    select2 ajax 设置默认值,初始值的方法

    今天小编就为大家分享一篇select2 ajax 设置默认值,初始值的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08
  • javscript 数组扁平化的实现

    javscript 数组扁平化的实现

    这篇文章主要介绍了javscript 数组扁平化的实现,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
    2020-02-02
  • JavaScript实现同步于本地时间的动态时间显示方法

    JavaScript实现同步于本地时间的动态时间显示方法

    这篇文章主要介绍了JavaScript实现同步于本地时间的动态时间显示方法,实例分析了javascript获取本地时间及动态显示的技巧,并对实现代码进行了较为详尽的分析说明,需要的朋友可以参考下
    2015-02-02
  • JS 获取鼠标左右键的键值方法

    JS 获取鼠标左右键的键值方法

    这篇文章主要介绍了JS 获取鼠标左右键的键值方法，很简单，但很实用，特别是在做与用户交互相关的东西
    2014-10-10
  • 支付宝小程序实现类似微信多行输入功能(思路详解)

    支付宝小程序实现类似微信多行输入功能(思路详解)

    这篇文章主要介绍了支付宝小程序实现类似微信多行输入功能,输入超过 8 行的时候会出现滚动,这样做的好处就是输入框不会直接顶到页面最顶部,支付宝小程序实现多行输入框：使用textarea多行输入框实现,感兴趣的朋友一起看看吧
    2024-02-02
  • JavaScript解析JSON格式数据的方法示例

    JavaScript解析JSON格式数据的方法示例

    这篇文章主要介绍了JavaScript解析JSON格式数据的方法,结合实例形式分析了JavaScript解析json格式数据的常用函数与使用技巧,需要的朋友可以参考下
    2017-01-01
  • replace()方法查找字符使用示例

    replace()方法查找字符使用示例

    查找字符的情况下会使用replace()方法，此方法很常见也很实用，下面有个不错的示例，感兴趣的朋友可以参考下，希望对大家有所把帮助
    2013-10-10

最新评论