<html>

     <head>

         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

         <title>及时验证</title>

         <style>

             #error{

                 color:red;

                 font-weight:bold;

             }

         </style>

         <script type="text/javascript">

       // Firefox, Google Chrome, Opera, Safari, Internet Explorer from version 9

             function OnInput (event) {

                 //alert ("The new content: " + event.target.value);

                 var value = event.target.value;

                 checkusername(value);

             }

       // Internet Explorer

             function OnPropChanged (event) {

             console.info(event)

                 if (event.propertyName.toLowerCase () == "value") {

                     var value = event.srcElement.value;

                     checkusername(value);

                 }

             }

         //验证用户名方法(只能是数字字母和中文，不能包括特殊字符)

         function checkusername(value){

             var regex = /^[0-9a-zA-Z\u4e00-\u9fa5]*$/;

             if(regex.test(value) == true){

                 //格式正确

                 document.getElementById("error").innerHTML="";

             }else{

                 //格式错误

                 document.getElementById("error").innerHTML="用户名格式错误，用户名由数字、字母、中文组成，不能包含特殊字符";

             }

         }

         </script>

     </head>

     <body>

         请输入用户名：

         <input name="username" type="text" oninput="OnInput (event)" onpropertychange="OnPropChanged (event)" placeholder="数字、字母、汉字" /><label id="error"></label>

     </body>

 </html>

JavaScript input框输入实时校验的更多相关文章

  1. input框输入金额显示千分位

    比如输入:1000000,则显示为1,000,000(或者是保留3位小数:1,000,000.000) 知识点: 1)JavaScript parseFloat() 函数: 定义:parseFloat ...

  2. js控制input框输入数字时，累计求和

    input框输入数字时,自动开始计算累加 <div class="form-group"> <label for="inputPassword3&quo ...

  3. js input框输入1位数字后自动跳到下一个input框聚焦

    // input框输入1位数字后自动跳到下一个input聚焦 function goNextInput(el){ var txts = document.querySelectorAll(el); f ...

  4. input框输入手机号码分隔显示

    在input框输入手机号码时,自动加入空格按照3,4,4位显示,如: 实现方法如下: <label>手机号码</label><input type="text& ...

  5. 模拟邮箱输入邮箱地址、收藏标签。input框输入内容后回车，内容显示成小方块并带删除按钮。

    模拟邮箱输入邮箱地址.收藏标签: 文本框输入文字后按回车键或者分号键,输入框中的文字变成小块并带删除按钮和操作. 页面代码: <!DOCTYPE html> <%@ page lan ...

  6. [TimLinux] JavaScript input框的onfocus/onblur/oninput/onchange事件介绍

    1. onfocus事件 input框获取到焦点时,触发了该事件,比如获取到焦点时,修改input框的背景色.这个功能其实可以使用css的伪类:focus来定义. 2. onblur事件 这个与onf ...

  7. input 框输入数字相关

    input框限制只能输入正整数,逻辑与和或运算 有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数字.小数点.英文字母.汉字等代码. 例如,输入大于0的正整数 代码如下: &l ...

  8. javascript input只输入数字和字母

    <input type="text" placeholder="请输入您的用户名..."> <script type="text/j ...

  9. 基于Element-UI的el-table，input框输入实现排序功能

    最终效果如下 实现要求: 如果输入的内容不是非负整数,那么提示报错,并且将值变为输入前的内容: 如果输入正确,则当输入的内容发生改变并且失去焦点以后,触发事件,重新获取列表: 实现思路 使用原生的in ...

随机推荐

  1. Python自动化开发-变量、数据类型和运算

    一.变量 变量定义:Variables are used to store infomation to referrenced and manipulated in a computer progra ...

  2. Javaweb 第2天 JavaScript课程

    JavaScript课程 两日大纲 ● JavaScript基本语法 ● JavaScript函数 ● JavaScript基于对象编程 ● JavaScript BOM对象编程 ● JavaScri ...

  3. iOS之上架打包时报错：ERROR ITMS-90086: "Missing 64-bit support.

    根据错误信息在网上基本找到的解决方法是设置targets中build settings中的architectures中的内容 这是因为现在提交的app必须支持64位.  

  4. select的onchange事件获取不了option的value

    一,select的onchange事件获取不了option的value是当你使用JQ($("#xxx").val())方法的获取的值一直提示undefined 二,解决方法: va ...

  5. MiniMetro Items

    圈代表居民区三角写字楼等工作区方块是商业区钻石是金融中心五角星是政府 十字是医院 扁扁的旅游景区

  6. 运行机制和JVM

    Java代码编译后生成一种与平台无关的字节码(也就是class文件).当然,这种字节码不是可执行的,必须使用Java解释器来解释执行. 负责解释执行字节码文件的是Java虚拟机,即JVM.JVM是可运 ...

  7. 带分页、过滤条件的DSL

    "query": { "bool": { "must_not": { "match_phrase": { "p ...

  8. 问题记录1：The VMware Authorization Service is not running.

    问题 VMware Workstation cannot connect to the virtual machine. Make sure you have rights to run the pr ...

  9. 关于VS2010编译警告LNK4221

    最近研究duilib,准备把里面自定义的一些工具类如CDuiString什么的用ATL的替换掉,于是遇到久仰大名的  warning C4251: xxx  needs to have dll-int ...

  10. mysql vachar

    --本文在CSDN文章的基础加以补充 一. varchar存储规则: 4.0版本以下,varchar(20),指的是20字节,如果存放UTF8汉字时,只能存6个(每个汉字3字节) 5.0版本以上,va ...