zoukankan      html  css  js  c++  java
  • 仅限正整数输入

    在某些浏览器不支持type number时这个是一个很好的替代方案

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  
    2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    3 <html xmlns="http://www.w3.org/1999/xhtml">
    4 <head>
    5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    6 <title>仅限正整数输入</title>
    7
    8 </head>
    9
    10 <body>
    11 <script>
    12 //void function (window,undefined){
    13 window.onload = function() {
    14 var doc = document,list = doc.getElementsByTagName('input');
    15
    16
    17 availableNumberInput(list);
    18 }
    19 function availableNumberInput(inputs) {
    20 var len = inputs.length,i,reg = /^(8|9|4[8-9]|5[0-7]|9[6-9]|10[0-5])$/ig;
    21
    22 document.onmousedown=function(){
    23 try{
    24 document.selection.empty()
    25 }catch(e){
    26 getSelection().removeAllRanges()
    27 }
    28 }
    29 for (i = len; i > 0; (inputs[--i].onkeydown = function(e) {
    30 e = window.event || e;
    31 var target = e.srcElement || e.target,code = e.charCode || e.keyCode;
    32 reg.lastIndex = 0;
    33 if (!reg.test(code) || e.shiftKey) {
    34 return false;
    35 }
    36 target.value === '0' && (target.value = '');
    37 },inputs[i].oncontextmenu = function() {
    38 return false;
    39 }),inputs[i].style.imeMode = 'disabled') {
    40 }
    41 }
    42 //}(window);
    43 </script>
    44
    45 拖个文字进输入框看看<br/>
    46 <input type="text"/><br/>
    47 <input type="text"/><br/>
    48 <input type="text"/>
    49 </body>
    50 </html>



  • 相关阅读:
    web端常见兼容性问题整理
    浏览器初始化样式
    html5特效库
    csshack
    进程与线程,并发、并行、异步、多线程
    js复制粘贴事件
    dom range相关
    vue和react在使用上的对比
    ListView往TreView里面拖拽
    ListView添加项目带序列
  • 原文地址:https://www.cnblogs.com/enix/p/2281663.html
Copyright © 2011-2022 走看看