table表格中，点击checkbox 的value值相加

<!DOCTYPE html>

<html>

<head>

<title>简单的行列相加求和处理</title>

<script src="assets/js/jquery-1.8.3.min.js"></script>

<script type="text/javascript">

    $(document).ready(function() {

        // 横向初始值

        var col_val = 0;

        // 纵向初始值

        var row_val = 0;

        $(".checkboxes").click(function(i) {

            col_val = 0;

            // 获取所有横向的被选中的复选框的值

            $(this).parents("tr").find(".checkboxes").each(function() {

                if ($(this).is(':checked')) {

                    var str = $(this).parent().text();

                    col_val = parseInt(col_val) + parseInt(str);

                }

            });

            // 给最后一个文本框赋值

            if(col_val == 0){

                $(this).parents("tr").find(".coltxt_:eq(0)").val("");

            } else {

                $(this).parents("tr").find(".coltxt_:eq(0)").val(col_val);

            }

            // 数据汇总

            checkrowcount_();

        });

        $('.checkrow_').click(function (){

            // 当前列下标

            row_val = 0;

            var row = $(this).parent().prevAll().length;

            // 获取所有纵向的被选中的复选框的值

            $("#tab tr").each(function(){

                if ($(this).find(".checkrow_:eq('"+row+"')").is(':checked')) {

                    var str = $(this).find("td:eq('"+row+"')").text();

                    row_val = parseInt(row_val) + parseInt(str);

                }

            });

            // 给最后一个文本框赋值

            if(row_val == 0){

                $("#tab").find(".checkrowtext_:eq('"+row+"')").val("");

            } else {

                $("#tab").find(".checkrowtext_:eq('"+row+"')").val(row_val);

            }

            // 数据汇总

            checkrowcount_();

        });

        function checkrowcount_(){

            // 汇总初始值

            var count_ = 0;

            // 获取所有横向文本框里面的值

            $(".coltxt_").each(function(){

                if($(this) != null && $(this).val() != ""){

                    var val_ = $(this).val();

                    count_ = parseInt(count_) + parseInt(val_);

                }

            });

            //$(".checkrowtext_").each(function(){

                //if($(this) != null && $(this).val() != ""){

                    //var val_ = $(this).val();

                    //count_ = parseInt(count_) + parseInt(val_);

                //}

            //});

            // 给最后一个文本框赋值

            if(count_ == 0){

                $("#tab").find(".checkrowcount_:eq(0)").val("");

            } else {

                $("#tab").find(".checkrowcount_:eq(0)").val(count_);

            }

        }

    });

</script>

</head>

<body>

    <table id="tab" border="1">

        <tr>

            <td>

                <input type="checkbox" class="checkboxes checkrow_" value="100">

                100

            </td>

            <td>

                <input type="checkbox" class="checkboxes checkrow_" value="50">

                50

            </td>

            <td>

                <input type="checkbox" class="checkboxes checkrow_" value="10">

                10

            </td>

            <td>

                <input type="text" readonly="readonly" class="coltxt_" value="">

            </td>

        </tr>

        <tr>

            <td>

                <input type="checkbox" class="checkboxes checkrow_" value="30">

                30

            </td>

            <td>

                <input type="checkbox" class="checkboxes checkrow_" value="20">

                20

            </td>

            <td>

                <input type="checkbox" class="checkboxes checkrow_" value="60">

                60

            </td>

            <td>

                <input type="text" readonly="readonly" class="coltxt_" value="">

            </td>

        </tr>

        <tr>

            <td>

                <input type="checkbox" class="checkboxes checkrow_" value="20">

                20

            </td>

            <td>

                <input type="checkbox" class="checkboxes checkrow_" value="40">

                40

            </td>

            <td>

                <input type="checkbox" class="checkboxes checkrow_" value="80">

                80

            </td>

            <td>

                <input type="text" readonly="readonly" class="coltxt_" value="">

            </td>

        </tr>

        <tr>

            <td>

                <input type="text" readonly="readonly" class="checkrowtext_" value="">

            </td>

            <td>

                <input type="text" readonly="readonly" class="checkrowtext_" value="">

            </td>

            <td>

                <input type="text" readonly="readonly" class="checkrowtext_" value="">

            </td>

            <td>

                <input type="text" readonly="readonly" class="checkrowcount_" value="">

            </td>

        </tr>

    </table>

    </br>

</body>

</html>

table表格中，点击checkbox 的value值相加的更多相关文章

用C#写一个函数，在一个数组中找出随意几个值相加等于一个值与迭代器对比
算法!用C#写一个函数,在一个数组中找出随意几个值相加等于一个值比如,数组{1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20} 要找出那些数相加等 ...
table表格实现点击修改 PHP同步数据库排序
最近几天在做一个网站,牵扯到一个导航管理的功能!领导说不用作,可是由于自己自作主张,搞了1天的功能.领导说这个导航管理就是不用做!容易牵扯出好多问题来!估摸是客户小的原因! 没办法就把我1天的劳动荒废 ...
5种做法实现table表格中的斜线表头效果
table表格,这个东西大家肯定都不陌生,代码中我们时常都能碰到,那么给table加一个斜线的表头有时是很有必要的,但是到底该怎么实现这种效果呢? 我总结了以下几种方法: 1.最最最简单的做法直接去 ...
在table表格中实现圆角效果
在table中设置border-radius发现不起作用,网上查找了一番,原因是border-collapse:collapse和border-radius不兼容. 设计图效果代码实现效果: < ...
table表格整体居中和 table表格中各行各列内容居中
1.table表格整个居中<div style="text-align: center;"> <table border="1" style= ...
使用js方法将table表格中指定列指定行中相同内容的单元格进行合并操作。
前言使用js方法对html中的table表格进行单元格的行列合并操作. 网上执行此操作的实例方法有很多,但根据实际业务的区别,大多不适用. 所以在网上各位大神写的方法的基础上进行了部分修改以适合自己 ...
Java 获取表格中某一个单元格的值
需求搜索页面返回表格样搜索结果, 获取搜索结果中某个单元格的具体值. 以下图为例, 下表是搜索返回的结果, 第一行是各个列的名字, 其它是具体的返回值. 方法1: 根据用户输入的表头名来确定是第几列 ...
table表格中的内容溢出布局方式
什么是内容溢出呢?其实就是当文字很多的时候,如果内容区域只有那么长,那么多出的部分以点点点代替. 这次做的案例是在table里面,我们知道当我们在table里输入过多的文字内容的时候会撑乱表格,例如一 ...
table表格中实现tbody部分可滚动，且thead部分固定
1.想要实现表格的thead部分固定切tbody部分可滚动,就需要将thead与tbody进行分离,具体做法是 1.设置thead,tbody都为display:block: 2.设置th与td的宽度 ...

随机推荐

三个数组求中位数，以及中位数的中位数----java算法实现
求三个数组的中位数,以及中位数的中位数. import java.util.Arrays; public class median { public static void main(String ...
【Apache系列】linux下Apache的常用操作
1. 启动/停止 1.1假设你的apahce安装目录为/usr/local/apache2,这些方法适合任何情况 apahce启动命令: /usr/local/apache2/bin/apachect ...
Windows系统下安装 CMake
在安装caffe框架的时候需要用到cmake,特将cmake的安装总结如下: 1 什么是cmake CMake是一个跨平台的编译(Build)工具,可以用简单的语句来描述所有平台的编译过程.CMake ...
十九、Node.js-非阻塞IO、异步以及 '事件驱动EventEmitter'解决异步
1.Nodejs 的单线程非阻塞 I/O 事件驱动在 Java.PHP 或者.net 等服务器端语言中,会为每一个客户端连接创建一个新的线程而每个线程需要耗费大约 2MB 内存.也就是说,理论上, ...
CTSC2017酱油记
恩..又是一篇酱油记.. 自从SHTSC完之后都在复习地理高考..根本没有刷题.. 于是就来CTSC了..因为奇怪的实验考..APIO又不能参加..只能拿一块Fe了.. DAY0 恩..不存在DAY0 ...
51 Nod 1024 Set
1024 矩阵中不重复的元素 1 秒 131,072 KB 10 分 2 级题一个m*n的矩阵. 该矩阵的第一列是a^b,(a+1)^b,.....(a + n - 1)^b 第二列是a^( ...
JDBC概念和使用
JDBC学习: JAVA的数据获取方式: 1 直接声明变量并赋值. 2 Scanner类控制台输入 3 IO流(将硬盘存储中的数据读取 ...
Idea中更改主题后xml配置文件局部黄色背景颜色去除
相信很多小伙伴和我一样一样的,喜欢更换Idea的主题,但是细心的小伙伴就发现了,每次更改主题后xml配置文件就会局部产生黄色背景颜色,对于强迫症患者真的是够了,网上也有部分文章,但是不够详细,也跟Id ...
【算法笔记】B1033 旧键盘打字
1033 旧键盘打字 (20 分) 旧键盘上坏了几个键,于是在敲一段文字的时候,对应的字符就不会出现.现在给出应该输入的一段文字.以及坏掉的那些键,打出的结果文字会是怎样? 输入格式: 输入在 2 行 ...
Windbg双机调试环境配置(Windows7/Windows XP+VirtualBox/VMware+WDK7600)
简介:Windbg双机调试内核.驱动下载软件: 下载Windbg(GRMWDK_EN_7600_1.ISO) 下载VirtualBox 5.2/VMware 12 一.安装WDK,这里要提一点的是D ...

table表格中 ，点击checkbox 的value值 相加

table表格中 ，点击checkbox 的value值 相加的更多相关文章

随机推荐

热门专题

table表格中，点击checkbox 的value值相加

table表格中，点击checkbox 的value值相加的更多相关文章