HTML:

<input type="tel" class="capital mui-input-clear" value="0.00">
 
<div class="redbag_box4_son">¥0.00</div>
 

JS:

$(document).ready(function(){
    // 限制文本框只能输入数字和小数点
    var precapital;
    document.querySelector('.capital').addEventListener('focus', function() {
        if (this.value == '0.00') {
            this.value = '';
        } else {
            this.value = this.value.replace(/\.00/, '').replace(/(\.\d)0/,'$1');
        }
        precapital = this.value;
    });
    document.querySelector('.capital').addEventListener('keyup', function() {
        this.value = this.value.replace(/^[\.]/, '').replace(/[^\d.]/g, '');
        if (this.value.split(".").length - 1 > 1) {
            this.value = precapital;
        }
        precapital = this.value;
    });
    document.querySelector('.capital').addEventListener('blur', function() {
        this.value = this.value.replace(/[\.]$/, '');
        this.value = this.value.replace(/(.*)\.([\d]{2})(\d*)/g,'$1.$2');
        this.value = Number(this.value).toFixed(2);
        var logNum = this.value.toString();
        if(logNum.match(/\./g) != null){
            integerNum = parseInt(logNum).toString().replace(/\d(?=(\d{3})+$)/g,'$&,');
            decimalNum = '.' + logNum.replace(/(.*)\.(.*)/g,'$2');
            document.querySelector(".redbag_box4_son").innerHTML = '¥'+integerNum+decimalNum;
        }else{
            document.querySelector(".redbag_box4_son").innerHTML = logNum.replace(/\d(?=(\d{3})+$)/g,'$&,');
        }
    });
})

参考链接:https://www.cnblogs.com/kousuke/p/perfect-input-for-money.html

input框限制输入金额的更多相关文章

  1. js—input框中输入数字,动态生成内容的方法

    项目中需要在前端实现: 用户输入数字n,动态生成n个元素,删除n,自动清空n个元素(如图一): 用户输入数字n,失焦生成n个元素,再聚焦修改n,自动清空n个元素(如图二): 图一: 图二: 需求一实现 ...

  2. jquery限制文本框只能输入金额

    $("#batch_diff_percent").keyup(function () { var reg = $(this).val().match(/\d+\.?\d{0,2}/ ...

  3. JS 限制input框的输入字数,并提示可输入字数

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  4. js控制input框只能输入数字和一位小数点和小数点后面两位小数

    <script language="JavaScript" type="text/javascript"> function clearNoNum( ...

  5. 使用正则限制input框只能输入数字/英文/中文等等

    常用HTML正则表达式 1.只能输入数字和英文的: 复制代码代码如下: <input onkeyup="value=value.replace(/[/W]/g,'') " o ...

  6. input框的输入限制

    1.输入数字 <input onKeyUp="value=value.replace(/[^\d|chun]/g,'')"> 2.只输入中文 <input typ ...

  7. 使用UIkit的uk-form-icon后input框无法输入的问题

    相关版本UIkit2.27.5 uikit.min.css默认使用uk-form-icon的属性pointer-events: none:因此表框无法点击. <style type=text/c ...

  8. javascript判断input框只能输入数字的方法

    javascript 只允许输入数字有很多方法,总结如下 1,只允许输入数字和小数点. <input onKeypress="return (/[\d.]/.test(String.f ...

  9. vue开发中利用正则限制input框的输入(手机号、非0开头的正整数等)

    我们在前端开发中经常会碰到类似手机号输入获取验证码的情况,通常情况下手机号的输入需要只能输入11位的整数数字.并且需要过滤掉一些明显不符合手机号格式的输入,那么我们就需要用户在输入的时候就控制可以输入 ...

随机推荐

  1. linux创建用户与登录提示motd与系统运行状态目录

    目录 一:登录提示文件 二:linux创建用户 三:系统日志目录 四:保存系统运行状态的目录 一:登录提示文件 登录成功之后显示的信息. 进入文本编辑 /etc/motd 文件中内容,会在用户登录系统 ...

  2. python采用json.dump和json.load存储数据

    #!/usr/bin/python # -*- coding: UTF-8 -*- import json numbers = [2,3,4,7,11,13] filename = 'numbers. ...

  3. Python学习笔记之读取文件、OS模块、异常处理、with as语法示例

    转:https://m.sogou.com/web/id=4c468b90-3f64-418c-acf8-990b5fe2a757/keyword=python%20os%E6%A8%A1%E5%9D ...

  4. dp学习(三)

    dp优化(一) 10. 状压dp 11. 倍增优化dp 12. 单调队列优化 13. 决策单调性优化(四边形不等式优化) 14. 斜率优化 15. 数据结构优化

  5. 在Linux虚拟机上挂载文件卷

    一 通过跳板机 将卷挂载在ec2 实例上的方法. 1 查询 机器上挂载了那些卷? // lsblk 是否已经是挂载卷 查看后面的目录 如果没有就是未挂载. 2 操作未挂载卷? /* sudo file ...

  6. 自定义ASP.NET MVC Html标签辅助方法

    原文:https://blog.csdn.net/a497785609/article/details/50184779 在ASP.NET MVC中,Html辅助方法给我们程序员带来很多方便,其重要性 ...

  7. HuTool工具包操作csv文件

    CsvUtil是CSV工具类,主要封装了两个方法: getReader 用于对CSV文件读取 getWriter 用于生成CSV文件 1.读取文件 读取为CsvRow CsvReader reader ...

  8. Java中class的前面添加public和不添加public有什么区别?

    需要知道的是修饰类和变量的用来控制这个被修饰的类和变量的适用范围的修饰词有: 1.public:表示公开的类和变量,既所有的类都可以引入使用的. 2.protected:表示受保护的类,只有子孙类和本 ...

  9. 微信小程序开发提升效率

    http://www.ifanr.com/minapp/790017 微信小程序的 API 实现需要兼顾方方面面,所以仍然使用 callback 写法. 众所周知,Callback-Hell(回调地狱 ...

  10. 你还不懂java的日志系统吗

    一.背景 在java的开发中,使用最多也绕不过去的一个话题就是日志,在程序中除了业务代码外,使用最多的就是打印日志.经常听到的这样一句话就是"打个日志调试下",没错在日常的开发.调 ...