input输入框的光标
2015-11-05 15:41
316 查看
上午的时候,以前一起配合Java后端的哥们问了个input光标的问题。
需求是这样:只能输入数字的input(一开始以为是输入金额这些的,后来才晓得是用来填写手机号)
他采用是直接百度来的如下方法:
完成需求是可以的,在用户体验上面有点问题,光标会自动移到末尾,导致无法通过键盘控制光标前进,只能在中间插入一个字符。
这哥们以前就只管java那块,js比我还水,所以让我给他改改。
给了两个方案:
一个是沿用之前的onkeyup;
或者也可以用onkeydown,直接阻止除数字、前进、后退、删除以外的按键生效;
需求是这样:只能输入数字的input(一开始以为是输入金额这些的,后来才晓得是用来填写手机号)
他采用是直接百度来的如下方法:
<input type="text" onafterpaste="this.value=this.value.replace(/\D/g,'')" onkeyup="this.value=this.value.replace(/\D/g,'')">
完成需求是可以的,在用户体验上面有点问题,光标会自动移到末尾,导致无法通过键盘控制光标前进,只能在中间插入一个字符。
这哥们以前就只管java那块,js比我还水,所以让我给他改改。
给了两个方案:
一个是沿用之前的onkeyup;
<input type="text" onafterpaste="this.value=this.value.replace(/\D/g,'')" onkeyup="onkeyupFn(this,event)">
function onkeyupFn(t,event){ var e = event || window.event; var c = e.keyCode; if (!(((c >= 48) && (c <= 57)) || ((c >= 96) && (c <= 105)) || c == 37 || c == 39 || c == 8)) { t.value=t.value.replace(/\D/g,''); } }
或者也可以用onkeydown,直接阻止除数字、前进、后退、删除以外的按键生效;
<input type="text" onafterpaste="this.value=this.value.replace(/\D/g,'')" onkeydown="onkeydownFn(event)">
function onkeydownFn(event){ var e = event||window.event; var c = e.keyCode; if (!(((c >= 48) && (c <= 57)) ||((c >= 96) && (c <= 105)) || c == 37 || c== 39 || c== 8)){ e.preventDefault ? e.preventDefault() : (e.returnValue = false); } }
相关文章推荐
- mysql外链接查询
- js返回最终样式函数,兼容IE和DOM,设置参数:元素对象、样式特性
- 会计的借贷关系
- mark Java NIO
- C++设计模式——观察者模式
- 开源项目Coding学习笔记(1):EaseStartView --- 第一个界面
- 用Python写飞机大战游戏之pygame入门(4):获取鼠标的位置及运动
- nova shelve
- js调用Android使用方法
- 转 Linux驱动开发学习日记
- Linux各版本安装Oracle10g 11g教程集合
- Spring拦截器中通过request获取到该请求对应Controller中的method对象
- 如何控制iOS的导航栏和状态栏的样式
- 网页乱码与设置utf-8乱码
- Linux运维 第三阶段 (十一)iptables
- Python
- SSH加密通道配置
- java.net.UnknownHostException 异常处理
- 老年代的垃圾回收要点
- ListView滑动顶、底部阴影,去除分割线,去除item的点击效果,滚动条