写着感觉有点乱，先记录，等有空的再想其他方法：
汽车排量
需求：
1. 可以，输入数字，数字+小数，数字+小数+t/l/T/L其中一个字符
2. 小数点前的数字1或2位
我的思路：
针对每个输入的字符做判断，
第一种：
```// 排量输入的规则
<input name="displacement" placeholder='{{T_displacement?T_displacement:"2.0L/2.0T"}}' placeholder-class='placeholder' bindinput="TInputValue" data-type='displacement' ></input>
TInputValue(e){
console.log(e)
let _type = e.currentTarget.dataset.type; //类型，因为其他用途需要用到，
let value = e.detail.value; //输入的值
let _val = ''; //赋值用
let _tempName = "T_" + _type; //placeholder上的变量名
let _reg1 = /^[0-9]$/; //只能输入数字
let _reg2 = /^([0-9])|(\.)$/; //数字和.
let _reg3 = /^t|l|T|L$/; //排量
let _regMoreNum = /^\d+$/; //多个数字
let _keyCode = String.fromCharCode(e.detail.keyCode); //获取Unicode 编码转换成内容
//点击了手机虚拟键盘上的清除键，
if (e.detail.keyCode == 8){
let _TtempVal = this.data.TtempVal;
_TtempVal = _TtempVal.slice(0, _TtempVal.length-1);
this.setData({
[_type]: _TtempVal,
TtempVal: _TtempVal,
[_tempName]: null
});
return false;
}
// 如果输入的是数字，则只留前两位
if (_regMoreNum.test(value) && value.length > 2) {
_val = value.slice(0,2)
}else{
//长度为1，且是数字的话就输入，临时记录之前输入的内容
if (value.length == 1 && _reg1.test(_keyCode)) {
_val = value;
this.setData({
TtempVal: value
})
} else if (value.length == 2 && _reg2.test(_keyCode)) { //第二位必须是.或数字，如果首位是0，则把0去除
_val = this.data.TtempVal == '0' ? parseInt(value) : value;
if (_keyCode == '.') {
this.setData({
isPoint: true,
TtempVal: value
});
} else {
this.setData({
isPoint: false,
TtempVal: value
});
}
} else if (value.length == 3) { //输入第三个数字的时候判断第二位是否为小数点
if (this.data.isPoint) {
if (_reg1.test(_keyCode)) {
_val = value;
this.setData({
TtempVal: value
});
} else {
_val = this.data.TtempVal
}
} else {
if (_keyCode == '.') {
_val = value;
this.setData({
TtempVal: value
});
} else {
_val = this.data.TtempVal
}
}
} else if (value.length == 4) {
//第二位是小数点
if (this.data.isPoint) {
if (_reg3.test(_keyCode)) {
_val = value.toUpperCase();
this.setData({
TtempVal: value.toUpperCase()
})
} else {
_val = this.data.TtempVal
}
} else {
if (_reg1.test(_keyCode)) { //第三位是小数点
_val = value;
this.setData({
TtempVal: value
})
} else {
_val = this.data.TtempVal
}
}
} else if (value.length == 5) {
//如果长度为5，输入的字符是字母tlTL其中一个就
if (_reg3.test(_keyCode)) {
_val = value.toUpperCase();
this.setData({
TtempVal: value.toUpperCase()
})
} else {
_val = this.data.TtempVal
}
} else {
if (this.data.TtempVal) {
_val = this.data.TtempVal
}
}
}
this.setData({
[_type]: _val,
[_tempName]: null
});
}
```
第二种：
·
//排量失去焦点
TBlurValue(e) {
console.log(e)
let _value = e.detail.value;
//如果最后一个.的索引+1的值跟整个字符长度一致，就表示.是最后一位，末尾加0
if (_value.lastIndexOf(".")+1 == _value.length){
let _valueNew = parseFloat(_value.slice(0, _value.length - 1));
// _valueNew = _valueNew > = 2
this.setData({
displacement: _valueNew.toFixed(1)
});
}
//失去焦点值为空的时候，则赋值为空，不然会出现NAN，存放临时数据的变量需要清空，不然输入其他错误的内容时会把之前临时保存的填充上去了
if (!_value) {
this.setData({
displacement: '',
TtempVal: ''
});
}
},
// 排量输入的规则
TInputValue(e) {
let _type = e.currentTarget.dataset.type; //类型，因为其他用途需要用到，
let value = e.detail.value; //输入的值
let _val = ''; //赋值用
let _tempName = "T_" + _type; //placeholder上的变量名
let _reg = /^\d{1,2}(\.\d{1}[tlTL]?|\.)?$/;
let _keyCode = String.fromCharCode(e.detail.keyCode); //获取ascii码转换成内容
console.log(_reg.test(value))
//如果值不为空,则通过正则来验证是否为true，如果是就存入输入的值，如果不是就存之前对的值
if (value) {
if (_reg.test(value)) {
_val = value.toUpperCase();
this.setData({
TtempVal: value.toUpperCase()
});
} else {
if (this.data.TtempVal) {
_val = this.data.TtempVal
}
}
} else {
_val = value;
// 存放临时数据的变量需要清空，不然输入其他错误的内容时会把之前临时保存的填充上去了（当清空后焦点还在，然后再输入错误的内容会出现）
this.setData({
TtempVal: ''
});
}
this.setData({
[_type]: _val,
[_tempName]: null
});
}
网友评论