<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

        "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

    <meta http-equiv="content-type" content="text/html;charset=utf-8">

    <title>111</title>

</head>

<body>

<label for="inputDemo">请输入：</label>

<input name="inputDemo" id="inputDemo" type="text" value=""/>

<span id="tips" style="color:red;"></span>

<br/>

<span id="check" style="width:60px;height:30px;line-height: 30px;display: inline-block;text-align: center;cursor: pointer;background-color: #eee;">检验</span>

<script type="text/javascript">

    window.onload = function(){

        var tip = '只能输入英文和数字，且首位必须是字母，字母总数不能超过3个，总长度不能超过20！';

        var tip2 = '字母总数不能超过3个';

        var tip3 = '检验成功';

        var btn_check = document.getElementById('check');

        if(btn_check.addEventListener){

            btn_check.addEventListener('click',inputDo,false);

        } else if(btn_check.attachEvent){

            btn_check.attachEvent('onclick',inputDo);

        }

        function inputDo(){

            var inputVal = document.getElementById('inputDemo').value;

            var reg = /^[a-zA-Z][0-9a-zA-Z]{0,19}$/;

            if(!inputVal.match(reg)){

                document.getElementById('tips').innerText =  tip;

            }else{

                var letter = 0;

                var letterArr = inputVal.split('');

                for(var i=0;i<letterArr.length;i++){

                    var asc = letterArr[i].charCodeAt();

                    if((asc>=97&&asc<=122)||((asc<=90&&asc>=65))){

                        letter++;

                        if(letter>3){

                            document.getElementById('tips').innerText = '字母总数不能超过3个';

                            return ;

                        }

                    }

                }

                if(letter<=3){

                    document.getElementById('tips').innerText =  tip3;

                }

            }

        }

    }

</script>

</body>

</html>

js 只能输入英文和数字，且首位必须是字母，字母总数不能超过3个，总长度不能超过20！的更多相关文章

  1. js只能输入数字、汉字、字母等正则匹配

    只能输英文:<input type="text" onkeyup="value=value.replace(/[^a-zA-Z]/g,'')"> 只 ...

  2. input输入框限制输入英文，数字，汉字

    <h1>js验证输入框内容</h1><br /><br /> 只能输入英文<input type="text" onkeyup ...

  3. JavaScript控制输入框中只能输入中文、数字和英文

    1.问题背景 遇到这样一个问题:有一个输入框,要求只能输入中文.数字和英文(即过滤特殊字符串) 2.JS代码 function  checkUsername() { //正则表达式 var reg = ...

  4. JS只能输入数字，数字和字母等的正则表达式

    1.只能输入英文 <input type="text" onkeyup="value=value.replace(/[^a-zA-Z]/g,'')"> ...

  5. js 只能输入数字和小数点

    <html><head><meta http-equiv="content-Type" content="text/html;charset ...

  6. js只能输入数字和小数点

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

  7. js判断输入是否为数字的具体实例

    这篇文章介绍了js判断输入是否为数字的具体实例,有需要的朋友可以参考一下 <html xmlns="http://www.3lian.com/"> <head&g ...

  8. [转]Win10输入法图标消失且只能输入英文的解决方法

    今天电脑开机后发现输入法图标不见了,而且只能输入英文,上网查了很多资料终于找到了解决方案,现摘录如下,以防再次遇到问题,便于查找.谢谢提供解决方案的大牛,如有侵权,请联系本人进行删除(文末放置了原文地 ...

  9. js限制input只能输入有效的数字，有且只有一个小数点，第一个不能为小数点-备

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. C#之打印乘法表

    设计说明 由图可知: 1.我们需要打印出九行: 2.每行中最大列数等于行数: 代码实现 public void Display1() { Console.WriteLine("乘法表:&qu ...

  2. struts1——静态ActionForm与动态ActionForm

    在struts1中,我们能够使用ActionForm来获取从client端提交上来的数据.并通过action配置中的name属性.将某个ActionForm配置到某次请求应答的Action中.作为本次 ...

  3. JAVA 几种多线程的简单实例 Thread Runnable

    实例1: class Hello extends Thread{ private String name; public Hello(){} public Hello(String name){ th ...

  4. php添加文件到压缩文件夹

    extension=php_zip.dll注释掉 <?php$filename = "test.zip"; ob_end_clean(); $zip = new ZipArc ...

  5. 运维自动化-Ansible

    前言 天天说运维,究竟是干什么的?先看看工作流程呗.一般来说,运维工程师在一家企业里属于个位数的岗位,甚至只有一个.面对生产中NNN台服务器,NN个人员,工作量也是非常大的.所以嘛,图中的我好歹也会配 ...

  6. ueditor和flexpaper的学习。。。。

    博客园的博主编辑文本的时候在博客园编辑器上编辑的,最近见到并学习了一点百度一款ueditor的编辑器可供程序猿们二次开发.... 见链接http://fex.baidu.com/ueditor/#st ...

  7. Jenkins 打包 java项目时 丢失 配置文件(resource)

    使用IDEA开发的spring boot 项目在本地打包运行可以,但是利用Jenkins打包运行提示读取不到配置文件中的变量,打开jar包发现里面没有配置文件.解决方法是在pom中增加如下配置 < ...

  8. JsonResult

    注意:如果有大量的json数据要处理,建议使用ASP .NET Web API框架处理,专门用来处理json数据交换并提供跨平台访问能力的 ConentType设置为application/json ...

  9. 第5章分布式系统模式 Data Transfer Object（数据传输对象）

    正在设计一个分布式应用程序,为了满足单个客户端请求,您发现自己对一个远程接口发出了多个调用,而这些调用所增加的响应时间超出了可接受的程度. 影响因素 在与远程对象通信时,请考虑下列需要权衡的因素: 远 ...

  10. <a>和<table>标签的应用

    今天介绍一下html中最重要的标签 标签分为 1.一般标签 如<img> <b></b>等 2.功能标签 如<a></a> 3.实体 如&a ...