<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. eclipse安装svn插件的多种方式

    方法一:在线安装 1.打开HELP->MyEclipse Configuration Center.切换到SoftWare标签页. 2.点击Add Site 打开对话框,在对话框Name输入Sv ...

  2. 微信公众号开发之网页中及时获取当前用户Openid及注意事项

    目录 (一)微信公众号开发之VS远程调试 (二)微信公众号开发之基础梳理 (三)微信公众号开发之自动消息回复和自定义菜单 (四)微信公众号开发之网页授权获取用户基本信息 (五)微信公众号开发之网页中及 ...

  3. 微信小程序开发系列(一)小程序开发初体验

    开发小程序所需的基本技能   关于小程序的介绍和使用场景这里不作介绍,这个系列的文章会一步一步地带领大家快速地学习和掌握小程序的开发. 关于还没有接触过小程序的开发者来说,最关心的问题无非就是,开发小 ...

  4. HttpContext.Current.Request.ServerVariables

    Request.ServerVariables("Url") 返回服务器地址Value 0: /WebSite1/Default.aspx Request.ServerVariab ...

  5. NodeJS 实现 客户端 js 加密

    NodeJS 实现 客户端 js 加密 思路: 服务端渲染业务代码js => 前后端约定加密算法 => 业务代码进行签名 => 客户端解密业务代码 => eval 执行 Nod ...

  6. svn服务器搭建-SuSE Linux Enterprise Server 11 SP3

    svn存储版本数据也有2种方式: 1.bdb: 2.fsfs. 因为BDB方式在服务器中断时,有可能锁住数据(搞ldap时就深受其害,没法根治),所以还是FSFS方式更安全一点,我也选择这种方式.   ...

  7. gc学习(转)

    一.GC特性以及各种GC的选择 1.垃圾回收器的特性 2.对垃圾回收器的选择 2.1 连续 VS. 并行 2.2 并发 VS. stop-the-world 2.3 压缩 VS. 不压缩 VS. 复制 ...

  8. python之实现缓存环

    看了CodeBokk 第二版通过python实现缓存环,吸收之后记录下,方便以后查阅. 任务: 定义一个固定尺寸的缓存,当它填满的时候,新加入的元素会覆盖第一个(最老的)元素.这种数据结构在存储日志和 ...

  9. sqlcipher for android

    github 地址 https://github.com/sqlcipher/android-database-sqlcipher 官网教程 https://www.zetetic.net/sqlci ...

  10. 浅谈javascript中stopImmediatePropagation函数和stopPropagation函数的区别

    在事件处理程序中,每个事件处理程序中间都会有一个event对象,而这个event对象有两个方法,一个是stopPropagation方法,一个是stopImmediatePropagation方法,两 ...