限制文本框只能输入数字或浮点数的JS脚步
1、oninput,onpropertychange,onchange的用法
l onchange触发事件必须满足两个条件:
a)当前对象属性改变,并且是由键盘或鼠标事件激发的(脚本触发无效)
b)当前对象失去焦点(onblur);
l onpropertychange的话,只要当前对象属性发生改变,都会触发事件,但是它是IE专属的;
l oninput是onpropertychange的非IE浏览器版本,支持firefox和opera等浏览器,但有一点不同,它绑定于对象时,并非该对象所有属性改变都能触发事件,它只在对象value值发生改变时奏效。
在textarea中,如果想捕获用户的键盘输入,用onkeyup检查事件就可以了,但是onkeyup并不支持复制和粘贴,因此需要动态监测textarea中值的变化,这就需要onpropertychange(用在IE浏览器)和oninput(非IE浏览器)结合在一起使用了。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>限制文本框输入数字或浮点数(暂只支持IE)</title>
</head>
<body>
<table border="" cellspacing="" cellpadding="" width="100%" style="background-color:#ccc; font-size:12px;">
<tr>
<td style="height:100px; background-color:#fff;" colspan="" align="center" valign="middle">
<h3>限制文本框输入数字或浮点数(暂只支持IE)</h3></td>
</tr>
<tr>
<td style="width: 30%; height:25px; background-color:#fff; padding-left:10px;">
该文本框只允许输入整型:</td>
<td style=" background-color:#fff; padding-left:10px;">
<input type="text" id="input1" name="input1" onpropertychange="javascript:CheckInputInt(this);" /></td>
</tr>
<tr>
<td style="width: 30%; height: 25px; background-color: #fff; padding-left:10px;">
该文本框允许输入浮点数:</td>
<td style="background-color: #fff; padding-left:10px;">
<input type="text" id="input2" name="input2" onpropertychange="javascript:CheckInputFloat(this);" /></td>
</tr>
<tr>
<td align="center" colspan="" rowspan="" style="padding-left: 10px; height: 58px;
background-color: #fff">
<a href="http://bbs.51aspx.com">返回上级</a></td>
</tr>
<tr>
</tr>
</table> <script language="javascript" type="text/javascript">
// Int 51-aspx
function CheckInputInt(oInput)
{
if ('' != oInput.value.replace(/\d/g,''))
{
oInput.value = oInput.value.replace(/\D/g,'');
}
} //Float 51aspx
function CheckInputFloat(oInput)
{
if('' != oInput.value.replace(/\d{,}\.{,}\d{,}/,''))
{
oInput.value = oInput.value.match(/\d{,}\.{,}\d{,}/) == null ? '' :oInput.value.match(/\d{,}\.{,}\d{,}/);
}
}
</script> </body>
</html>
限制文本框只能输入数字或浮点数的JS脚步的更多相关文章
- js限制文本框只能输入数字方法小结
有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数字.小数点.英文字母.汉字等代码. 例如,输入大于0的正整数 代码如下: <input onkeyup="i ...
- js限制文本框只能输入数字方法小结(转)
这篇文章主要分享下js代码限制文本框中只能输入数字的多个实例,学习下js控制文本框中输入数字的方法,需要的朋友可以参考下 有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数 ...
- C# 使用js正则表达式,让文本框只能输入数字和字母,最大长度5位
使用js正则表达式,让文本框只能输入数字和字母,最大长度5位,只需要加个onkeyup事件,即可简单实现 <asp:TextBox ID="txtBegin" runat=& ...
- 用Jquery控制文本框只能输入数字和字母
用Jquery控制文本框只能输入数字和字母 $.fn.onlyNum = function () { $(this).keypress(function (event) { var eventObj ...
- js限制文本框只能输入数字
JS判断只能是数字和小数点1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'') ...
- 监听SWT文本框只能输入数字
在SWT开发中,很多时候需要文本框只能输入数字(当输入字母或者其他字符时为无效),这个时候需要给文本框设置监听VerifyListener, code 如下: text.addVerifyListen ...
- JQuery 限制文本框只能输入数字和小数点
$(function(){ /*JQuery 限制文本框只能输入数字*/ $(".NumText").keyup(function(){ $(this).val($(this).v ...
- js设置文本框只能输入数字
JS判断只能是数字和小数点 1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'' ...
- JQuery限制文本框只能输入数字和小数点的方法
<input type="text" class="txt NumText" Width="100px" /> $(func ...
随机推荐
- redis安装与基本配置
获取下载包 wget http://download.redis.io/releases/redis-2.8.24.tar.gz 解压和编译 tar -zxvf redis-2.8.24.tar.gz ...
- ajax 另外两种返回类型(json xml)
返回json类型(例子): <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http ...
- HTML学习开篇
最近开的博客,一切都是从零开始,昨天刚写了java的开篇,今天写一写HTML开篇. 很多初学者都不太看重前端的学习,甚至鄙视前端,我刚开始时就这样.其实,要想成为一个真正的程序员,前端和后端都必须了解 ...
- iOS Error
1),'libxml/tree.h' file not found Solution: 1. 导入libxml2.dylib 包 2.设置Header Search Paths 为 /usr/inc ...
- CocoaPods安装第三方出错:XCode7.3
错误[!] The dependency `Masonry (~> 0.6.1)` is not used in any concrete target. 在之前,我使用的版本是XCode7.0 ...
- python中的@
一.函数修饰符 '@' 用做函数的修饰符,可以在模块或者类的定义层内对函数进行修饰, 出现在函数定义的前一行,不允许和函数定义在同一行 一个修饰符就是一个函数,它将被修饰的函数作为参数,并返回修饰后的 ...
- 项目打包文件build.xml
Make命令其实就是一个项目管理工具,而Ant所实现功能与此类似.像make,gnumake和nmake这些编译工具都有一定的缺陷,但是Ant却克服了这些工具的缺陷.最初Ant开发者在开发跨平台的应用 ...
- Monkey测试的策略和分析
Monkey测试针对不同的对象和不同的目的采用不同的测试方案,首先测试的对象.目的及类型如下: 测试的类型分为:应用程序的稳定性测试和压力测试 测试对象分为:单一apk和apk集合 测试的目的分为:解 ...
- laravel 中 与前端的一些事4 之合并压缩静态文件
合并压缩多个静态文件到一个文件里面,可以减少网站的http请求,稍微优化性能,提高网站的用户体验 使用elixir来实现: 敲命令 合并并压缩js和css文件
- Git基础操作
配置秘钥 1.检查本机有没有秘钥 检查~/.ssh看看是否有名为d_rsa.pub和id_dsa.pub的2个文件. $ ~/.sshbash: /c/Users/lenovo/.ssh: Is a ...