html number禁止输入,input[type=number]禁止输入非数字类型以外的内容

input[type=number]禁止输入非数字类型以外的内容

2018-1-29    分类: 前端资源

html5中input有number类型可以实现只输入数字类型，但是还不够完善，还是需要js正则来进行判断过滤。

//初始化样式

input[type=number]::-webkit-textfield-decoration-container {

background-color: red; /* 背景颜色 */

}

input[type=number]::-webkit-inner-spin-button {

-webkit-appearance: none; /* 去掉上下箭头 */

}

input[type=number]::-webkit-outer-spin-button {

-webkit-appearance: none; /* 有无看不出差别 */

}

var re = /^[0-9]+.?[0-9]*$/; //判断输入的是否位数字

$('#amount').bind('input propertychange', function() {

if (!re.test($(this).val())) { //只允许纯数字或数字加小数点的格式存在

if($(this).val()==''){

$(this).val('');

}else{

$(this).val( Math.floor( $(this).val()*100 )/100 ) //不四舍五入，仅仅保留2位小数

}

}

});