el-input设置type为number时，切换为中文输入法输入会让光标上移的问题解决

1.el-input设置type为number时，切换为中文输入法输入会让光标上移的问题解决

element的input框有个bug，就是当他设置类型时number的时候，你用中文输入法输入，点空格确定，他的光标会移动到上面去

解决前（效果图）：

解决后（效果图）：

解决方法：

<style>
/*** 解决el-input设置类型为number时，中文输入法光标上移问题**/
.el-input__inner{line-height: 1px !important;
}/*** 解决el-input设置类型为number时，去掉输入框后面上下箭头**/
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {-webkit-appearance: none;margin: 0;
}
</style>

2.el-element 中 input设置了type=“number“还能输入e和负数

解决方法：

οnkeypress=“return (/[\d]/.test(String.fromCharCode(event.keyCode)));”

<el-input v-model="queryForm.remainingCountBeg"placeholder="剩余次数(起)" clearable type="number" maxlength="9" onkeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)));">
</el-input>

3.禁止键盘上下键事件 ( 其实按键盘上下键还是可以让其变成负数 )

解决方法：

onMounted(() => {// el-input type=number时,如果点击键盘上下可以改变input中的值,这个方法是禁止改变document.onkeydown = function () {if (window.event.keyCode === 38 || window.event.keyCode === 40) {window.event.returnValue = false;}}})

参考：https://blog.csdn.net/weixin_49035434/article/details/125390323

el-input设置type为number时，切换为中文输入法输入会让光标上移的问题解决相关推荐

input标签type为number时如何去除加减按钮效果
我们在使用input type = number 时只想输入数字时会出现如下图所示的效果显然这不是我们想要的只需要我们简单把css样式改变下即可 /* 谷歌 */input::-webkit- ...
input设置type为number,禁止输入e等符号,去除上下箭头
禁止输入e等符号 // html <el-inputv-model="frequency"type="number"@keydown.native=&qu ...
解决：input框当type为number时maxlength失效
慕客网标明的用法是适用type为text和passswod的当我input框设置type为number的时候怎么限制输入长度呢?使用outinput就可以啦 <input type=" ...
H5去掉输入框type为number时的上下箭头
H5去掉输入框type为number时的上下箭头 html5中,input type="number"时右边会有一个上下小箭头,介绍去掉这个箭头的方法,完成浏览器的兼容,页面 ...
html上下箭头控制文本框加减,HTML5去掉输入框type为number时的上下箭头的实现方法...
html5中,input type="number"时右边会有一个上下小箭头,介绍去掉这个箭头的方法,完成浏览器的兼容,页面效果的统一一.公共样式去掉输入框type为numb ...
lubuntu输入法设置_Ubuntu 18.04 16.04 设置输入法切换方法中文输入法
Ubuntu 18.04 16.04 设置输入法切换方法中文输入法发布时间:2018-08-23 11:30, 浏览次数:2644 , 标签: Ubuntu 新装的unbunu 18.04 16. ...
阻止中文输入法输入拼音的时候触发input事件
阻止中文输入法输入拼音的时候触发input事件前言最近看element-ui源码的时候看到el-input发现的.这个少见的事件. compositionstart.compositionend事 ...
html输入框为什么不能粘贴,移动端input框type为number仍可以输入和粘贴【中文】的问题...
先这个问题非常棘手,因为这可能是浏览器的一个bug,当用户在type=number的input框输入中文时,这个值其实并不会被接收,但是有时会被展现.即:它会像普通值一样显示,但是双向绑定的参数接收不 ...
Ubuntu 18.04 16.04 设置输入法切换方法中文输入法
新装的unbunu 18.04 16.04 也可以.默认应该有中文输入法,但是应该不太好用.我们安装一个搜狗输入法. 下面的shell代码实现了更新软件,检查语言支持.然后下载搜狗输入法,并且安装. ...
linux16.0切换输入法,Ubuntu 18.04 16.04 设置输入法切换方法中文输入法
新装的unbunu 18.04 16.04 也可以.默认应该有中文输入法,但是应该不太好用.我们安装一个搜狗输入法. 下面的shell代码实现了更新软件,检查语言支持.然后下载搜狗输入法,并且安装. ...

el-input设置type为number时，切换为中文输入法输入会让光标上移的问题解决

el-input设置type为number时，切换为中文输入法输入会让光标上移的问题解决相关推荐

最新文章

热门文章