zoukankan      html  css  js  c++  java
  • 表单中多个文本框实时计算金钱总和值

    //输入的时候如果输入小数2.220立即变成2.22保留两位js工具类
    function clearNoNum(obj){
    obj.value = obj.value.replace(/[^d.]/g,"");
    obj.value = obj.value.replace(/.{2,}/g,".");
    obj.value = obj.value.replace(".","$#$").replace(/./g,"").replace("$#$",".");
    obj.value = obj.value.replace(/^(-)*(d+).(dd).*$/,'$1$2.$3');
    if(obj.value.indexOf(".")< 0 && obj.value !=""){
    obj.value= parseFloat(obj.value);
    }
    }


    //总费用合计计算
    $(function(){
    $("input:lang(background)").css({"background-color":"#d7d7d7","color":"back"})
    $("input:lang(bc)").css({"background-color":"#d7d7d7","color":"back"})
    var fyhjinput = document.querySelectorAll('.fyhj');
    $.each($(".fyhj"),function(i,n){
    var input=fyhjinput[i];
    input.onkeyup= function () {
    clearNoNum(this)
    var hjfy=0;
    for(var i=0;i<fyhjinput.length;i++){
    var inpVal=parseFloat($(fyhjinput[i]).val()==null||$(fyhjinput[i]).val()==""?0:$(fyhjinput[i]).val());
    hjfy+=inpVal;
    }
    $("#fyhj").val(hjfy.toFixed(2))
    }
    })
    })

    <div class="layui-inline">
    <label class="layui-form-label">加油金额(元)</label>
    <div class="layui-input-block">
    <input type="text" maxlength="12" lay-verify="number" class="layui-input fyhj" name="jyje" placeholder="加油金额(元)" autocomplete="off" />
    </div>
    </div>

    <div class="layui-inline">
    <label class="layui-form-label">路桥费(元)</label>
    <div class="layui-input-block">
    <input type="text" maxlength="12" lay-verify="number" class="layui-input fyhj" name="lqf" placeholder="路桥费(元)" autocomplete="off" />
    </div>
    </div>

    <div class="layui-inline">
    <label class="layui-form-label">维修保养费(元)</label>
    <div class="layui-input-block">
    <input type="text" maxlength="12" lay-verify="number" class="layui-input fyhj" name="wxbyf" placeholder="维修保养费(元)" autocomplete="off" />
    </div>
    </div>

    <div class="layui-inline">
    <label class="layui-form-label">其他费用(元)</label>
    <div class="layui-input-block">
    <input type="text" maxlength="12" lay-verify="number" class="layui-input fyhj" name="qtfy" placeholder="其他费用(元)" autocomplete="off" />
    </div>
    </div>
    <div class="layui-inline">
    <label class="layui-form-label">合计费用(元)</label>
    <div class="layui-input-block">
    <input type="text" maxlength="12" lang="background" id="fyhj" value="0.00" readonly="readonly" lay-verify="number" class="layui-input" name="hjfy" placeholder="合计费用(元)" autocomplete="off" />
    </div>
    </div>

  • 相关阅读:
    matlab中s函数编写心得-转自水木
    webgl编程指南笔记【一】
    node辅助工具npm、yarn、nrm、n、Nodemon
    es6复习笔记
    游戏客户端开发劝退
    一步步搭建现代前端框架(三)
    一步步搭建现代前端框架(二)
    一步步搭建现代前端框架(一)
    vue 生命周期钩子 路由钩子 动画钩子 执行顺序
    怎样提升手机相机照片效果
  • 原文地址:https://www.cnblogs.com/java-llp/p/10794398.html
Copyright © 2011-2022 走看看