兼容IE7、IE8、IE9的input type=number插件

IE11版本好像才兼容input type=”number”，但是现在Win7版本操作系统下，很多人的IE版本都是IE7/8/9，所以为了体验就自己写了一个小插件，支持设置最大值、最小值、数字间隔。大家可以试着用一下，如果有哪些Bug欢迎指出，后期修改。

用法说明

1、首先必须引入jQuery（由于我是用的是1.11.3版本，如果其他版本有问题欢迎指出、后期修改）
2、在所有代码最后引入inputNumber.css和inputNumber.js文件，如：

<!--[if IE]><link rel="stylesheet" href="css/inputNumber.css"><script src="js/inputNumber.js"></script>
<![endif]-->

3、支持设置最大值、最小值、数字间隔
4、引用的时候请注意路径问题
下面是一个例子（此处仅贴出html代码，至于css、js文件可在之后的下载位置进行下载）：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Firefox和IE对input number的兼容</title><script src="js/jquery-1.11.3.js"></script><style>* {margin: 0;padding: 0;}.input-style{width: 150px;height: 20px;}</style>
</head>
<body>
<div class="inputNumber-relative"><input class="input-style" type="number" name="number" id="inputNumber" min="5" max="55" step="3">
</div>
<!--[if IE]><link rel="stylesheet" href="css/inputNumber.css"><script src="js/inputNumber.js"></script>
<![endif]-->
<script>
/*** IE低版本和Firefox对input type="number"的兼容（因为Firefox中input type="number"依然可以输入非数字内容）* 可按的按键包括数字（键盘上字母上的数字和小键盘中的数字）、删除键、Tab切换键、减号按键、小数点键*/
$("#inputNumber").on("keydown", function (event) {var event = event.which ? event.which : window.event.keyCode;if (event == 8 || event == 9 || event == 109 || event == 110 || (event >= 48 && event <= 57) || (event >= 96 && event <= 105)) {return true;} else {return false;}
});
</script>
</body>
</html>

实现的效果如下（在IE9下面上下键的点击、滚轮滚动增减值都支持，在IE7/8下面仅支持上下点击事件）：

所有文件的下载地址：http://download.csdn.net/download/fxss5201/9757758

兼容IE7、IE8、IE9的input type=number插件相关推荐

一行代码轻松搞定各种IE兼容问题,IE6,IE7,IE8,IE9,IE10
在网站开发中不免因为各种兼容问题苦恼,针对兼容问题,其实IE给出了解决方案Google也给出了解决方案百度也应用了这种方案去解决IE的兼容问题? 百度源代码如下: <!Doctype html& ...
搞定各种IE兼容问题,IE6,IE7,IE8,IE9,IE10 -
在网站开发中不免因为各种兼容问题苦恼,针对兼容问题,其实IE给出了解决方案Google也给出了解决方案百度也应用了这种方案去解决IE的兼容问题? 百度源代码如下: 1 <!Doctype htm ...
IE兼容问题IE6,IE7,IE8,IE9,IE10
x-ua-compatible 用来指定IE浏览器解析编译页面的model x-ua-compatible 头标签大小写不敏感,必须用在 head 中,必须在除 title 外的其他 meta 之前使 ...
bootstrap支持ie8 让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法
做一个在线系统,PC端也要做,但要兼容千恶的IE8[IE6 是万恶,打死我都不会管IE6],IE8 是我底线了md, 在IE8下 bottstrap 错乱,变形,不支持一些属性的问题,下面看了一篇某 ...
在XP上同时运行IE6,IE7,IE8,IE9
一个成熟的网站,必然要兼容所有的浏览器,以便赢得最多的客户. 但是如何在一个操作系统上测试所有的浏览器呢, 为了帮助朋友打包了所有的IE版本. 同时兼容IE6,IE7,IE8,IE9的绿色版本 IE6 ...
解决input[type=number]无法显示非数字字符的问题
在移动端webview实现的页面中,有数字的地方必须使用input type="number"类型的input,否则触发后的键盘为全键盘,而非数字键盘.但另外的一个问题是,inpu ...
react input[type='number']
最近在写业务的时候遇到一个坑,当用户在 input[type='number'] 中输入 "01" 时,我将值设置为 1 ,但它不起作用,它仍显示 "01". ...
动手写个数字输入框1：input[type=number]的遗憾
前言最近在用Polymer封装纯数字的输入框,开发过程中发现不少坑,也有很多值得研究的地方.本系列打算分4篇来叙述这段可歌可泣的踩坑经历: <动手写个数字输入框1:input[type=nu ...
h5 android数字键盘,【笔记】移动端H5数字键盘input type=number的处理（IOS和Android）...
在Vue中的项目,基于VUX-UI开发,一个常见的需求: 1.金额输入框 2.弹出数字键盘 3.仅支持输入两位小数,限制最大11位数,不允许0开头第一,首先想到额就是在VUX-UI中制定type=n ...

兼容IE7、IE8、IE9的input type=number插件

用法说明

兼容IE7、IE8、IE9的input type=number插件相关推荐

最新文章

热门文章