利用 keyCode 控制数字输入框

下面这段代码，可以控制用户只能输入数字、小数点、负号，且数字第一位不可为0：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>lik-input-number</title>
</head><body>
<input type="text" class="lik_input_number" style="color:#ccc" value="请输入数字" οnfοcus="fn_focus(this);"οnblur="fn_blur(this);">
</body><script src="jquery-1.8.1.min.js"></script>
<script>// 输入框模拟placeholderfunction fn_focus(ele) {if (ele.value == ele.defaultValue) {ele.style = "color:#333";ele.value = '';} else {ele.style = "color:#333";}}function fn_blur(ele) {var reg = /^[s]*$/;if (reg.test(ele.value) || ele.value == ele.defaultValue) {ele.style = "color:#ccc";ele.value = ele.defaultValue;} else {ele.style = "color:#333";}}$(function () {$('.lik_input_number').live('keydown', function (e) {//控制第一个数字不能为0if ($(this).val().length > 1 && $(this).val().slice(0, 1) == 0 && $(this).val().slice(1, 2) != '.') {$(this).val($(this).val().slice(1, $(this).val().length));}//控制只能输入数字、小数点、负号if ((e.keyCode < 48 || (e.keyCode > 57 && e.keyCode < 96) || (e.keyCode > 105 && e.keyCode < 109) || (e.keyCode > 110 && e.keyCode < 189) || e.keyCode > 190) && e.keyCode != 8) {return false;}});$('.lik_input_number').live('keyup', function (e) {//控制第一个数字不能为0if ($(this).val().length > 1 && $(this).val().slice(0, 1) == 0 && $(this).val().slice(1, 2) != '.') {$(this).val($(this).val().slice(1, $(this).val().length));}//控制只能输入数字、小数点、负号if ((e.keyCode < 48 || (e.keyCode > 57 && e.keyCode < 96) || (e.keyCode > 105 && e.keyCode < 109) || (e.keyCode > 110 && e.keyCode < 189) || e.keyCode > 190) && e.keyCode != 8) {return false;}});});
</script>
</html>

转载于:https://www.cnblogs.com/likwin/p/7145323.html

利用 keyCode 控制数字输入框相关推荐

利用QRegExp限制输入框只接受数值（可以是小数）
要求: 1) 输入的只能是十进制的整数或者小数: 2) 数值可以是正数,零,或者负数: 3) 假如输入的数字包含小数点,则小数点只能出现一次: 4) 假如输入的数字包含小数点,则小数点前至少要有一位数 ...
如何做一个听话的 “输入框”
前言在移动端的web开发中,一提起输入框,程序猿(媛)肯定有很多可以吐槽的点. 在输入框的运用中,小编也是很心累呀~ 不过,经过我潜(cai)心(keng)研(jiao)究(xun),也算是了解了 ...
操作键盘事件源码解析（常用的鼠标事件、键盘事件对象之keyCode属性）
操作键盘事件常用的鼠标事件 <!DOCTYPE html> <html lang="en"><head><meta charset=&q ...
如何做一个听话的 “输入框”--摘抄
前言在移动端的web开发中,一提起输入框,程序猿(媛)肯定有很多可以吐槽的点. 在输入框的运用中,小编也是很心累呀~ 不过,经过我潜(cai)心(keng)研(jiao)究(xun),也算是了解了 ...
输入框掩码规则与提示技巧
知识清单同类型按钮事件的利用和技巧输入框掩码元素与规则使用掩码框事件的开发 MaskInputRejected事件信息提示框的开发利用 maskedTextBox 掩码控件 <==> ...
手机端实现6位验证码输入框效果
也就是界面上,6个input框当初想着应该很简单的,结果做起来发现,还是坑蛮多的首先的想法就是6个input框,每输入一个数字之后,切换到下一个input,即切换focus,昨晚发现安卓机很流畅 ...
移动端页面inputfile打不开_移动端input“输入框”常见问题及解决方法
转自 https://www.cnblogs.com/ljx20180807/p/9837748.html 1. ios中,输入框获得焦点时,页面输入框被遮盖,定位的元素位置错乱: 当页input存在 ...
小程序输入框完成切换到下个输入框
小程序输入框完成切换到下个输入框需求:页面有多个输入框,一个输完点击回车,切换到下个输入框思路:利用小程序输入框的focus(获取焦点)属性,在bindconfirm事件(点击完成后触发)里设置变 ...
JavaScript学习笔记（5）
文章目录 DOM重点核心总结注册事件两种方式事件监听方式 addEventListener(通用)attachEvent(基本不用) 注册事件兼容性解决方案(照顾不同版本浏览器) 删除事件(解绑事 ...

利用 keyCode 控制数字输入框

利用 keyCode 控制数字输入框相关推荐

最新文章

热门文章