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脚步的更多相关文章

  1. js限制文本框只能输入数字方法小结

    有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数字.小数点.英文字母.汉字等代码. 例如,输入大于0的正整数  代码如下: <input onkeyup="i ...

  2. js限制文本框只能输入数字方法小结(转)

    这篇文章主要分享下js代码限制文本框中只能输入数字的多个实例,学习下js控制文本框中输入数字的方法,需要的朋友可以参考下   有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数 ...

  3. C# 使用js正则表达式，让文本框只能输入数字和字母，最大长度5位

    使用js正则表达式,让文本框只能输入数字和字母,最大长度5位,只需要加个onkeyup事件,即可简单实现 <asp:TextBox ID="txtBegin" runat=& ...

  4. 用Jquery控制文本框只能输入数字和字母

    用Jquery控制文本框只能输入数字和字母 $.fn.onlyNum = function () { $(this).keypress(function (event) { var eventObj ...

  5. js限制文本框只能输入数字

    JS判断只能是数字和小数点1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'') ...

  6. 监听SWT文本框只能输入数字

    在SWT开发中,很多时候需要文本框只能输入数字(当输入字母或者其他字符时为无效),这个时候需要给文本框设置监听VerifyListener, code 如下: text.addVerifyListen ...

  7. JQuery 限制文本框只能输入数字和小数点

    $(function(){ /*JQuery 限制文本框只能输入数字*/ $(".NumText").keyup(function(){ $(this).val($(this).v ...

  8. js设置文本框只能输入数字

    JS判断只能是数字和小数点 1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'' ...

  9. JQuery限制文本框只能输入数字和小数点的方法

    <input type="text" class="txt NumText"  Width="100px"  /> $(func ...

随机推荐

  1. [多校联考2 T3] 排列 (DP)

    DP Description 对于一个排列,考虑相邻的两个元素,如果后面一个比前面一个大,表示这个位置是上升的,用 I 表示,反之这个位置是下降的,用 D表示.如排列 3,1,2,7,4,6,5 可以 ...

  2. cas的http配置和rmi远程调用

    1.cas配置http请求(服务端) 1) 解压cas-server-3.4.4-release.zip将modules目录下的cas-server-webapp-3.4.4.war改名称为cas.w ...

  3. 在mysql数据库原有字段后增加新内容

    update table set user=concat(user,$user) where xx=xxx; [注释]这个语法要求原来的字段值不能为null(可以为空字符''):

  4. file_get_contents微信头像等待时间过长的原因

    UPDATE 2016/05/13 stackoverflow上的解决方法:http://stackoverflow.com/questions/3629504/php-file-get-conten ...

  5. Javascript学习笔记：9种创建对象的方式

    最基本的对象创建方式是通过Object构造函数或对象字面量的方式创建: ①通过Object构造函数的方式创建对象: var person=new Object();//或者写成var person={ ...

  6. (转) C/C++中const关键字详解

    文章转自  http://www.cnblogs.com/yc_sunniwell/archive/2010/07/14/1777416.html 为什么使用const?采用符号常量写出的代码更容易维 ...

  7. C#浅拷贝与深拷贝区别

    也许会有人这样解释C# 中浅拷贝与深拷贝区别: 浅拷贝是对引用类型拷贝地址,对值类型直接进行拷贝. 不能说它完全错误,但至少还不够严谨.比如:string 类型咋说? 其实,我们可以通过实践来寻找答案 ...

  8. 推荐流程设计器http://www.processon.com/

    以前一直用的Rational Rose进行类图,流程设计,最近发现了ProcessOn使用了下,感觉很好用,相比rose 1.有中文说明,rose全专业英文,理解起来比较费劲: 2.直线比较直,ros ...

  9. AngularJS事件绑定的使用详解

    本文和大家分享的主要是AngularJS中事件绑定相关知识点,希望通过本文的分享,对大家学习和使用AngularJS有所帮助. 1.绑定事件:表达式.事件方法名: 2.绑定点击事件实例:显示.隐藏页面 ...

  10. Android基础:Activity

    Activity基本概念 Activity代表活动窗口,通过Context加载页面显示内容,每一个Activity都必须在manifest.xml中注册. 一个应用程序由多个界面构成,回退栈,活动窗口 ...