手机号码格式化;实现手机号344格式输入:000 0000 0000
2017-12-23 23:16
330 查看
本文转自:http://blog.csdn.net/demod/article/details/78786168
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> body { position: absolute; left: 0; right: 0; width: 100%; height: 100%; margin: 0; padding: 0; } #uphone { box-sizing: border-box; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); border: 2px solid #ddd; width: 300px; height: 40px; border-radius: 10px; outline: none; padding-left: 15px; font-size: 18px; } #uphone:focus { border-left-color: #317EF3; border-top-color: #FF3366; border-bottom-color: #FF9800; border-right-color: #09BB07; } </style> </head> <body> <input id="uphone" type="tel" pattern="[0-9]*" maxlength="13" autocomplete="off" value="" placeholder="请输入您的手机号" oncontextmenu="return false" onpaste="return false" oncopy="return false" oncut="return false" /> <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> <script> $("#uphone").on("input propertychange", function () { var uphone = $(this).val(); $(this).val(formatPhone(uphone)); moveEnd($(this)[0]); }); function formatPhone(phone_num) { var valueStr = phone_num.replace(/\D/g, "").substr(0, 11); var len = valueStr.length; if (len > 3 && len < 8) { return valueStr.substr(0, 3) + " " + valueStr.substr(3); } else if (len >= 8) { return valueStr.substr(0, 3) + " " + valueStr.substr(3, 4) + " " + valueStr.substr(7); } return valueStr; }; //在部分安卓机上input的光标会在添加空格后错位,需要这个方法主动将光标放置在最后 function moveEnd(obj) { //通过是否支持createTextRange判断是否是IE if (obj.createTextRange) { var rg = obj.createTextRange(); rg.collapse(false); rg.select(); } else { setTimeout(function () { var len = obj.value.length; obj.setSelectionRange(len, len); }, 20); } }; </script> </body> </html>
相关文章推荐
- 实现手机号344格式输入:000 0000 0000
- iOS 手机号码格式化,344格式
- 绑定手机号功能,注册后在个人中心有一个绑定手机号的菜单,输入手机号码,手机接收短信验证码(有效期5分钟),,简述实现思路。
- iOS开发笔记:实现对手机号、邮箱输入格式的判断(正则表达式)
- 输入文本框中输入手机号自动添加空格以及在手机号中间的空格处删除时自动删除末尾号码其他位置则删除直接删除实现
- Android Edittext 手机号码格式输入设置
- Java 实现手机号的归属地查询 手机号码的卡的类型
- js手机号码验证,手机号格式验证,…
- jQuery实现手机号码输入提示功能实例
- iOS手机号正则表达式并实现344格式 (正则的另一种实现方式)
- 判断邮箱,手机号码,身份证,用户名,昵称等输入格式是否正确的 正则表达式
- 笔记 -- 11-- 完美实现手机号344格式化效果
- php利用正则表达式实现手机号码格式验证代码
- 手机号码处理为344格式
- android输入框EditText输入银行卡,输入手机,输入身份证格式化的实现
- 手机号码格式化输入工具 PhoneNumberFormatUtils
- jq控制输入手机号码格式显示为3-4-4
- iOS 数字格式化(手机号码 银行卡号 格式化,验证码输入控制)
- jQuery实现手机号码输入提示功能实例
- iOS UITextField实用实现手机账号344格式 —— HERO博客