zoukankan      html  css  js  c++  java
  • 输入*时的放大提示

    常用功能,练练手。

    <!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>
    <style type="text/css">
    #amplify
    {
     width:145px;
     height:40px;
     text-align:center;
     font-size:18px;
     color:orange;
     background-color:#ffff99;
    }
    </style>
    </head>
    <body>
    <div id="amplify"></div>
    <input type="text" id="mobileNumber" maxlength="11" onkeyup="show()"/>
    <script type="text/javascript">
    function show(){
        var tmp=document.getElementById("mobileNumber").value,length=tmp.length,output=tmp;
        if(length>3&&length<=7){
            output=tmp.replace(/(^d{3})/,"$1-");
        }
        else if(length>7){
            output=tmp.replace(/(^d{3})(d{4})/,"$1-$2-");
        }
        document.getElementById("amplify").innerHTML=output;
    }
    </script>
    </body>
    </html>


    效果图

  • 相关阅读:
    相关正则的一些知识
    数组中的方法
    封装ajax
    swiper结合ajax的轮播图
    事件
    原型、原型链
    HTML 常用标签
    HTML基础了解
    JSON 与 XML基本了解
    JavaScript(js)
  • 原文地址:https://www.cnblogs.com/linda586586/p/4161816.html
Copyright © 2011-2022 走看看