网站首页 > 教程分享 正文
在只能输入【正小数】的输入框获取到焦点时,移除千位分隔符,
在输入数据时,实时校验输入内容是否正确,
失去焦点后,添加千位分隔符格式化数字。同时小数位未满时末尾补0。
HTML代码
<input type="text" class="force-decimalToFixed-2-3" .../>
JS调用方法
$(document.body).find("input[type=text]").each(function() {
// 验证输入内容
callCustomiseInputCheck(this);
});
验证小数位补0,【正小数】类型方法
function callCustomiseInputCheck(inputObject) {
jQuery.each(inputObject.classList, function(itemIndex, classItem) {
//例:<input type="text" class="force-decimalToFixed-2-3" .../> 整数部桁数:2、小数部桁数:3
if (/^force\-decimalToFixed\-\d{1,}\-\d{1,}$/.test(classItem)) {
// 方法【runInputFilter】,参照文章【Jquery实时验证,只能输入指定长度的数字】
runInputFilter(inputObject, ',', function(value) {
if (/^\d*\.?\d*$/.test(value)) {//数字的场合
var jsInteger = value.split('.')[0];//整数部
var jsScale = value.split('.')[1];//小数部
//整数部分越界的场合
if (jsInteger && parseInt(jsInteger) > 0
&& jsInteger.length > parseInt(classItem.split('-')[2])) {
return false;
}
//小数部分越界的场合
if (jsScale && parseInt(jsScale) > 0
&& jsScale.length > parseInt(classItem.split('-')[3])) {
return false;
}
return true;
} else {
//不是数字的场合
return false;
}
});
//格式化
postLostFocus(inputObject, function(inputObject) {
if (inputObject.value == "") {
return false;
}
if (!inputObject.value.contains('.')) {
inputObject.value = inputObject.value + '.';
}
var regExp = RegExp(/^(\-?)(0{1,})?(\d*\.?\d*)$/);
var outPutArray = inputObject.value.match(regExp);
inputObject.value = outPutArray[1] + outPutArray[3];//去掉左侧重复的0(例:「0012=>12」、「0012.23=>12.23」)
var classItemLength = classItem.split('-').length
if (classItemLength == 4) {//指定小数位数的场合
var jsScale = parseInt(classItem.split('-')[3]);//小数部
inputObject.value = inputObject.value.split('.')[0] + '.' + inputObject.value.split('.')[1]).padEnd(jsScale, '0')//小数末尾补0
}
inputObject.value = CommonUtilJs.addComma(inputObject.value)
});
//终止循环
return false;
}
});
}
共通处理方法
/**
* 绑定失去焦点时的处理
* @param textbox HTML输入框
* @param lostFocusFunction 失去焦点时的处理
* 例:postLostFocus(ocument.getElementById("XXX"),functionXXXXX);
*/
function postLostFocus(textbox, lostFocusFunction) {
["focusout"].forEach(function(event) {
var eventCommonPostLostFocus = function(event) {
lostFocusFunction(this);
}
// 参照文章【前端Jquery调用on或bind方法,避免重复绑定】
addEventExtras(textbox, event, eventCommonPostLostFocus);
});
}
function CommonUtilJs() { }
//数值格式化
CommonUtilJs.addComma = function(value) {
var patern = /^([\+\-]?\d+)(\d{3})([\,\d+]*)(\.\d+)?$/;
var rep = "";
var val = "";
if (value != undefined && value != null) {
val = String(value);
while (rep != val) {
rep = val;
val = rep.replace(patern, "$1,$2$3$4");
}
}
return val;
};
- 上一篇: Java集合框架:解锁高效编程的艺术
- 下一篇: Jquery 详细用法(jquery1)
猜你喜欢
- 2025-05-05 Javascript 多线程编程的前世今生
- 2025-05-05 36个工作中常用的JavaScript函数片段「值得收藏」
- 2025-05-05 「JS优化篇」你的 if - else 代码肯定没我写的好
- 2025-05-05 vue的理解-vue源码 历史 简介 核心特性 和jquery区别 和 react对比
- 2025-05-05 让编辑器支持word的复制黏贴,支持截屏的黏贴
- 2025-05-05 由浅入深,66条JavaScript面试知识点(七)
- 2025-05-05 了解这些难度较高的前端面试题,助你顺利完成求职
- 2025-05-05 jquery的事件名称和命名空间的方法
- 2025-05-05 Vue-Web前端选择题(50题)(vue选择题及答案)
- 2025-05-05 jQuery HTML代码/文本(jquery解析html文本)
你 发表评论:
欢迎- 最近发表
-
- 有了这份900多页的Android面试指南,你离大厂Offer还远吗?
- K2 Blackpearl 流程平台总体功能介绍:常规流程功能
- 零基础安卓开发起步(一)(安卓开发入门视频)
- 教程:让你的安卓像Windows一样实现程序窗口化运行
- Android事件总线还能怎么玩?(事件总线有什么好处)
- Android 面试被问“谈谈架构”,到底要怎样回答才好?
- Android开发工具Parcel和Serialize
- Android 中Notification的运用(notification widget安卓)
- Android退出所有Activity最优雅的方式
- MT管理器-简单实战-去除启动页(mt管理器怎么去除软件弹窗)
- 标签列表
-
- css导航条 (66)
- sqlinsert (63)
- js提交表单 (60)
- param (62)
- parentelement (65)
- jquery分享 (62)
- check约束 (64)
- curl_init (68)
- sql if语句 (69)
- import (66)
- chmod文件夹 (71)
- clearinterval (71)
- pythonrange (62)
- 数组长度 (61)
- javafx (59)
- 全局消息钩子 (64)
- sort排序 (62)
- jdbc (69)
- php网页源码 (59)
- assert h (69)
- httpclientjar (60)
- postgresql conf (59)
- winform开发 (59)
- mysql数字类型 (71)
- drawimage (61)
本文暂时没有评论,来添加一个吧(●'◡'●)