<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<style>
/*去除input的type为number的右边上下箭头*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
}
input[type="number"] {
-moz-appearance: textfield;
}
</style>
</head>
<body>
<!--没有父元素的时候
<input type="number" name="num" />
<input type="number" name="num2" />-->
<!--有父元素的时候-->
<div id="d1">
<input type="number" name="num" />
<input type="number" name="num2" />
</div>
<script>
//没有父元素的时候
//(function () {
// //获取name名字对应的input
// var number = document.getElementsByName("num")[0],
// number2 = document.getElementsByName("num2")[0];
// //添加事件监听对象,限制最大字数,去除-号
// //number.addEventListener("input", function () {
// // this.value = this.value.replace(/\-/, "");
// // if (this.value.length > 2) { this.value = this.value.slice(0, 2) };
// //});
// // 当事件发生时: e自动收到浏览器给的event对象
// //number2.addEventListener("input", function (e) {
// // 记录了事件最初触发的目标元素
// // e.target.value = e.target.value.replace(/\-/, "");
// // if (e.target.value.length > 5) { e.target.value = e.target.value.slice(0, 5) };
// //});
// number.oninput = function () {
// //去除负号
// this.value = this.value.replace(/\-/, "");
// //限制字数
// if (this.value.length > 2) { this.value = this.value.slice(0, 2) };
// };
// number2.oninput = function () {
// this.value = this.value.replace(/\-/, "");
// if (this.value.length > 5) { this.value = this.value.slice(0, 5) };
// };
//})();
//有父元素的时候
(function () {
var number = document.getElementsByName("num")[0],
number2 = document.getElementsByName("num2")[0];
//多个平级子元素,要绑定相同的时间处理函数,只要绑定父元素即可
d1.oninput = function (e) {
e.target.value = e.target.value.replace(/\-/, "");
};
number.oninput = function () {
//限制字数
if (this.value.length > 2) { this.value = this.value.slice(0, 2) };
};
number2.oninput = function () {
if (this.value.length > 5) { this.value = this.value.slice(0, 5) };
};
})()
</script>
</body>
</html>
input的type为number时,去除右边箭头,限制负数和字数
最新推荐文章于 2022-10-08 11:04:02 发布