jQuery的多个运行总计

本文介绍了jQuery的多个运行总计的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

0I我使用jQuery来计算多个文本框的运行总和。刚刚找到如何获取工作，前几天一个真棒响应，但现在我遇到了另一个问题。当使用一个选择，对于GetTotal总量是完全计算。然而，当我有第二个选择，总计开始的冲突与彼此，不再计算正确。我一直在寻找一个解决的办法有一段时间了，没有任何人有什么想法？

下面是我目前使用的选择：

函数GetTotal（txtBox）{        无功总= 0;        $（输入：文本），每个（函数（指数值）{。            总+ = parseInt函数（$（值）.VAL（）|| 0）;        }）;        $（＃chkTotal）的HTML（总）;    }

我的观点使用这些TXT盒

＆LT; D​​IV CLASS =主编场＆GT;        @ Html.TextBox（字段1的String.Empty，新{inputType下=TEXT，ID =字段1的onchange =GetTotal（本）}）    ＆LT; / DIV＆GT;    ＆LT; D​​IV CLASS =主编场＆GT;        @ Html.TextBox（字段2的String.Empty，新{inputType下=TEXT，ID =场2的onchange =GetTotal（本）}）    ＆LT; / DIV＆GT;    ＆LT; D​​IV＆GT;        ＆LT; H3个总选中＆LT; / H3 GT＆;    ＆LT; / DIV＆GT;＆LT; D​​IV ID =chkTotal＆GT;＆LT; / DIV＆GT;

现在我想实现的另一个选择，这将总共两个额外的编辑栏...

函数GetTotal1（txtBox）{        VAR共1 = 0;        $（输入：文本），每个（函数（指数值）{。            共1 + = parseInt函数（$（值）.VAL（）|| 0）;        }）;        $（＃disTotal）HTML（共1页）。    }

查看：

＆LT; D​​IV CLASS =主编场＆GT;        @ Html.TextBox（字段3，的String.Empty，新{inputType下=TEXT，ID =FIELD3的onchange =GetTotal1（本）}）    ＆LT; / DIV＆GT;    ＆LT; D​​IV CLASS =主编场＆GT;        @ Html.TextBox（字段4的String.Empty，新{inputType下=TEXT，ID =字段4的onchange =GetTotal1（本）}）    ＆LT; / DIV＆GT;    ＆LT; D​​IV＆GT;        ＆LT; H3个总分布式＆LT; / H3 GT＆;    ＆LT; / DIV＆GT;    ＆LT; D​​IV ID =disTotal＆GT;＆LT; / DIV＆GT;

解决方案

在两个和使用不同的HTML类，如

＆LT; D​​IV CLASS =主编场＆GT;    @ Html.TextBox（字段1的String.Empty，新{@class =共有的inputType =TEXT，ID =字段1的onchange =GetTotal（本）}）＆LT; / DIV＆GT;＆LT; D​​IV CLASS =主编场＆GT;    @ Html.TextBox（字段2的String.Empty，新{@class =共有的inputType =TEXT，ID =场2的onchange =GetTotal（本）}）＆LT; / DIV＆GT;＆LT; D​​IV＆GT;    ＆LT; H3个总选中＆LT; / H3 GT＆;＆LT; / DIV＆GT;＆LT; D​​IV ID =chkTotal＆GT;＆LT; / DIV＆GT;＆LT; D​​IV CLASS =主编场＆GT;    @ Html.TextBox（字段3，的String.Empty，新{@class =共1的inputType =TEXT，ID =FIELD3的onchange =GetTotal1（本）}）＆LT; / DIV＆GT;＆LT; D​​IV CLASS =主编场＆GT;    @ Html.TextBox（字段4的String.Empty，新{@class =共1的inputType =TEXT，ID =字段4的onchange =GetTotal1（本）}）＆LT; / DIV＆GT;＆LT; D​​IV＆GT;    ＆LT; H3个总分布式＆LT; / H3 GT＆;＆LT; / DIV＆GT;＆LT; D​​IV ID =disTotal＆GT;＆LT; / DIV＆GT;

使用Javascript：

函数GetTotal（txtBox）{    无功总= 0;    $（'输入：text.total0'）。每个（函数（指数值）{        总+ = parseInt函数（$（值）.VAL（）|| 0）;    }）;    $（＃chkTotal）的HTML（总）;}功能GetTotal1（txtBox）{    VAR共1 = 0;    $（'输入：text.total1'）。每个（函数（指数值）{        共1 + = parseInt函数（$（值）.VAL（）|| 0）;    }）;    $（＃disTotal）HTML（共1页）。}

0I am using jQuery to calculate a running total on multiple textboxes. Just found an awesome response on how to get that working a few days ago, but now I am running into another problem. When using one selector, the total for GetTotal is calculated perfectly. However, when I include the second selector, the totals begin to conflict with one another, and no longer calculate properly. I have been searching for a solution to this for some time now, does anyone have any ideas?

Here is the selector i am currently using:

function GetTotal(txtBox) { var total = 0; $('input:text').each(function(index, value) { total += parseInt($(value).val() || 0); }); $("#chkTotal").html(total); }

My view uses these txt boxes

<div class="editor-field"> @Html.TextBox("Field1", String.Empty, new {InputType = "text", id = "field1", onchange = "GetTotal(this)" }) </div> <div class="editor-field"> @Html.TextBox("Field2", String.Empty, new {InputType = "text", id = "field2", onchange = "GetTotal(this)" }) </div> <div> <h3>Total Checked</h3> </div> <div id="chkTotal"></div>

Now I am trying to implement another selector which will total two additional editor fields...

function GetTotal1(txtBox) { var total1 = 0; $('input:text').each(function (index, value) { total1 += parseInt($(value).val() || 0); }); $("#disTotal").html(total1); }

View:

<div class="editor-field"> @Html.TextBox("Field3", String.Empty, new {InputType = "text", id = "field3", onchange = "GetTotal1(this)" }) </div> <div class="editor-field"> @Html.TextBox("Field4", String.Empty, new {InputType = "text", id = "field4", onchange = "GetTotal1(this)" }) </div> <div> <h3>Total Distributed</h3> </div> <div id="disTotal"></div>

解决方案

Use different HTML classes on the two sums, like

<div class="editor-field"> @Html.TextBox("Field1", String.Empty, new {@class = "total0", InputType = "text", id = "field1", onchange = "GetTotal(this)" }) </div> <div class="editor-field"> @Html.TextBox("Field2", String.Empty, new {@class = "total0", InputType = "text", id = "field2", onchange = "GetTotal(this)" }) </div> <div> <h3>Total Checked</h3> </div> <div id="chkTotal"></div> <div class="editor-field"> @Html.TextBox("Field3", String.Empty, new {@class = "total1", InputType = "text", id = "field3", onchange = "GetTotal1(this)" }) </div> <div class="editor-field"> @Html.TextBox("Field4", String.Empty, new {@class = "total1", InputType = "text", id = "field4", onchange = "GetTotal1(this)" }) </div> <div> <h3>Total Distributed</h3> </div> <div id="disTotal"></div>

Javascript:

function GetTotal(txtBox) { var total = 0; $('input:text.total0').each(function(index, value) { total += parseInt($(value).val() || 0); }); $("#chkTotal").html(total); } function GetTotal1(txtBox) { var total1 = 0; $('input:text.total1').each(function (index, value) { total1 += parseInt($(value).val() || 0); }); $("#disTotal").html(total1); }