今天在项目中遇到了一个求平均值的需求,大致需求就是,页面上面有四个input框,失去焦点就计算平均值,结果保留两位小数,并输出在页面上。不多说了,直接奉上代码,如有更好思路或者想法,都欢迎大家和我讨论。代码如下:

html:

<div id="par">
    <input id="test1" class="err" type="text" placeholder="测试信息" value="" />
    <input id="test2" class="err" type="text" placeholder="测试信息" value="" />
    <input id="test3" class="err" type="text" placeholder="测试信息" value="" />
    <input id="test4" class="err" type="text" placeholder="测试信息" value="" />
    <div id="test5"></div>
</div>

js:

function handler(arr,avgId){
    var l = arr.length,num = 0,sum=0;
    for(var i=0;i<l;i++){
        sum += getValue(arr[i]);
    }
    function getValue(id){
        var t = typeof id == "object"?id:$("#"+id),val = t.val();
        if(!isNaN(val)&&val!=""){
            num+=1;
            val = Number(val);
        }else{val=0;t.val("")};
        return val;
    }
    avgId = typeof avgId =="object"?avgId:$("#"+avgId);
    num == 0 ? avgId.text("") : avgId.text((sum/num).toFixed(2));
}

var myArr = ["test1","test2","test3","test4"];
$("#par").on("change",".err",function(){
    handler(myArr,$("#test5"));
})

/**

*注意:代码依赖jQuery,使用前,请先引入

*/

转载请注明出处:http://www.cnblogs.com/callmesummer/p/3940222.html

拿出手机扫一扫,希望大家能支持一下:

js实现求平均数功能的更多相关文章

  1. Hadoop阅读笔记(二)——利用MapReduce求平均数和去重

    前言:圣诞节来了,我怎么能虚度光阴呢?!依稀记得,那一年,大家互赠贺卡,短短几行字,字字融化在心里:那一年,大家在水果市场,寻找那些最能代表自己心意的苹果香蕉梨,摸着冰冷的水果外皮,内心早已滚烫.这一 ...

  2. 原生JS实现购物车结算功能代码+zepto版

    html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...

  3. poj 1004:Financial Management(水题,求平均数)

    Financial Management Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 126087   Accepted: ...

  4. C++求平均数

    题目内容:求若干个证书的平均数. 输入描述:输入数据含有不多于5组的数据,每组数据由一个整数n(n<=50)打头,表示后面跟着n个整数. 输出描述:对于每组数据,输出其平均数,精确到小数点后3位 ...

  5. 使用JS来实现验证码功能

    最近想为自己的Django博客添加验证码功能,本来想使用第三方库来实现的,不过考虑到添加第三方库对性能的影响,以及第三方库是否安全可靠的问题,还是用自己的代码来实现吧.反正用JS来实现验证码功能又不是 ...

  6. ASP.NET MVC 4 RC的JS/CSS打包压缩功能 (转载)

    ASP.NET MVC 4 RC的JS/CSS打包压缩功能 打包(Bundling)及压缩(Minification)指的是将多个js文件或css文件打包成单一文件并压缩的做法,如此可减少浏览器需下载 ...

  7. JS 实现百度搜索功能

    今天我们来用JS实现百度搜索功能,下面上代码: HTML部分: <!DOCTYPE html> <html> <head> <meta charset=&qu ...

  8. Js元素拖拽功能实现

    Js元素拖拽功能实现 需要解决的问题 最近项目遇到了一个问题,就是用户某个操作需要弹出一个自定义的内容输入框,但是有个缺点,当浏览太大的时候没办法点击确认和取消按钮,应为这个弹出框是采用绝对定位的,取 ...

  9. js中记住密码功能

    js中记住密码功能(在前端实现) 直接上例子(如果你也要实现的话注意改一些变量名称,jsp代码不包含样式) Jsp代码: <form class="am-form tpl-form-l ...

随机推荐

  1. SVG 路径(path)

    本文转自:https://developer.mozilla.org/zh-CN/docs/Web/SVG/Tutorial/Paths <path>元素是SVG基本形状中最强大的一个,它 ...

  2. 我永远的 dell 15r

    陪伴我三年多的15r  让我疯狂过.努力过.更记录了我很多的成长,与很多个瞬间.看到它是有感情的.还记得第一次失去她.我好像失去了自己. 我是一个程序员.每个程序员都有自己的环境配置.不同的软件.就是 ...

  3. ORA-00257: archiver error. Connect internal only, until freed 错误的处理方法

    转帖:原文地址http://blog.csdn.net/panys/article/details/3838846 archive log 日志已满ORA-00257: archiver error. ...

  4. 初学QML之qmlRegisterType

    qmlRegisterType 是一个可以将C++实现的类在QML中调用的,连接C++和QML的一个工具 首先来看QtAssistant的介绍 int qmlRegisterType(const ch ...

  5. Mahout快速入门教程

    Mahout 是一个很强大的数据挖掘工具,是一个分布式机器学习算法的集合,包括:被称为Taste的分布式协同过滤的实现.分类.聚类等.Mahout最大的优点就是基于hadoop实现,把很多以前运行于单 ...

  6. sql 字段先计算后再拿比对的字段进行比对 效率提升100倍

    关于日期索引的使用,不要计算后再对比,否则使用不了索引例如:以下执行不了索引,耗时很大 dywl=# explain analyze SELECT car_bill.billno,car_bill.b ...

  7. eclipse Content Assist 无法使用,不能自动补全的解决办法

    今天用eclipse写JAVA代码,写着写着突然,eclipse 的自动补全功能失效了,没办法自动补全.折腾半天,终于解决了. 在window->Preferences->Java-> ...

  8. Sherlock and GCD

    1 import fractions, functools, sys if __name__ == '__main__': T = int(sys.stdin.readline()) for _ in ...

  9. HDU 4411 Arrest

    http://www.cnblogs.com/jianglangcaijin/archive/2012/09/24/2700509.html 思路: S->0 流量为K费用0 0->i 流 ...

  10. LeetCode_Unique Binary Search Trees II

    Given n, generate all structurally unique BST's (binary search trees) that store values 1...n. For e ...