һ
 ¼ע

QQ¼

ֻһٿʼ

ƼĶ

+
̳ WEBҳǰ뿪 ǰ̨ű

HTMLinputһֱһ

[]
45953 websjy 2016-6-23 15:19:34
| ʾȫ¥
1F
ôȿЧͼ



˵ڹһ⣬ԿȡԿһ4飬ÿ4ֽڡ
          ʵֵģȻеLOW
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>htmlinputһֱһ</title>
  6.     <style>
  7.         .input input {
  8.             display: inline-block;}

  9.         .input{width: 580px;height:41px;line-height:41px;margin-right:20px;}
  10.         .input input {
  11.             border:1px solid #ccc;
  12.             width: 100px;
  13.             height: 40px;
  14.             outline:none;
  15.             font-size: 14px;
  16.             font-weight: inherit;
  17.             text-align: center;
  18.             line-height: 40px;
  19.             color: #000;
  20.             background:#fff;
  21.             margin-right:10px;
  22.             margin-left:10px;
  23.             font-family: "microsoft yahei";
  24.         }
  25.         .input:first-child {
  26.             margin-left:0;
  27.         }
  28.     </style>
  29. </head>

  30. <body>
  31. <div class="input" id="coupon">
  32.     <input type="tel" placeholder="" name="sn1" maxlength="4" id="sn1"> - <!-
  33.     -><input type="tel" placeholder="" name="sn2" maxlength="4" id="sn2"> - <!-
  34.     -><input type="tel" placeholder="" name="sn3" maxlength="4" id="sn3"> - <!-
  35.     -><input type="tel" placeholder="Կ" name="sn4" maxlength="4" id="sn4">
  36. </div>

  37. </body>
  38. <script src="http://www.websjy.com/bbs/jquery/jquery.min.js"></script>
  39. <script>
  40.     //Ĭϵһʾfocus
  41.     $(document).ready(function() {
  42.         $("#sn1").focus();
  43.         //Զһ
  44.         $("input[name^='sn']").each(function() {
  45.             $(this).keyup(function(e) {
  46.                 e = window.event || e;
  47.                 var k = e.keyCode || e.which;
  48.                 if (k == 8) {   //8ǿո
  49.                     if ($(this).val().length < 1) {
  50.                         $(this).prev().focus();
  51.                         $(this).prev().focus(function() {
  52.                             var obj = e.srcElement ? e.srcElement: e.target;
  53.                             if (obj.createTextRange) { //IE
  54.                                 var range = obj.createTextRange();
  55.                                 range.moveStart("character", 4);
  56.                                 range.collaPSe(true);
  57.                                 range.select();
  58.                             }
  59.                         });
  60.                     }
  61.                 } else {
  62.                     if ($(this).val().length > 3) {
  63.                         $(this).next().focus();
  64.                     }
  65.                 }
  66.             })
  67.         });

  68.         $("input[type='text'][id^='sn']").bind('keyup',
  69.                 function() {
  70.                     var len = $("#sn1").val().length + $("#sn2").val().length + $("#sn3").val().length + $("#sn4").val().length;
  71.                     if (len == 16) device_verify();
  72.                 });
  73.     });
  74. </script>
  75. </html>
ƴ


аԴ

Ҫ ¼ ſػ鿴ûʺţ¼ע  

x
Դ΢http://weibo.com/techued Դ΢Źںţweb-tech
ʹõ ٱ ظ
fhuj3d96 2016-12-6 12:34:22
| ʾȫ¥
2F
֧һ°ɣ
http://www.bjard.com/news/943.html
http://www.bjard.com/news/944.html
http://www.bjard.com/news/945.html
http://www.bjard.com/news/947.html
http://www.bjard.com/news/946.html
http://www.bjard.com/news/949.html
http://www.bjard.com/news/950.html
Դ΢http://weibo.com/techued Դ΢Źںţweb-tech
ʹõ ٱ ظ ֧
fhuj3d96 2017-1-5 16:58:02
| ʾȫ¥
4F
лл¥ˣ¥ˣǺ
Դ΢http://weibo.com/techued Դ΢Źںţweb-tech
ʹõ ٱ ظ ֧
б

ֹ

̳¡ͼƬѷϴվԭתԻ,µİȨԭ
վַİȨ֪ͨǵĹԱ,Ա(Email:admin@websjy.com)ʱȡȨɾ
ܾκκʽڱ̳л񹲺͹ִ!

QQ| 42011102000510|Archiver|ֻ|Դ ( ICP14013341-1

GMT+8, 2018-12-15 03:30

Powered by Discuz! X3.2

ԴԴվ  ԴAPPӦ֮

ٻظ ض б