Javascript添加变量和更改事件

我有以下代码

$(document).ready(function () {
    $('#big_1').change(function () {
        var bigAmt = document.getElementById("big_1").value
            + document.getElementById("big_2").value
            + document.getElementById("big_3").value
            + document.getElementById("big_4").value
            + document.getElementById("big_5").value
            + document.getElementById("big_6").value
            + document.getElementById("big_7").value 
            + document.getElementById("big_8").value
            + document.getElementById("big_9").value
            + document.getElementById("big_10").value;

        var elem = document.getElementById("totalBig");
        elem.value = bigAmt;
    });
});

实际上，我想在输入文本值“big_1 to big_10”时，将big_1的值添加到big_10中。文本字段中的任何一个改变其值，这都应该被调用

到目前为止，我只参加大变革活动

通过这种方式添加，我得到了一个javascript错误，我认为我添加它们的方式非常混乱

我应该做些什么来更改代码以便总结

big_1变为big_10文本字段值，当big_1变为big_10（其中任何一个）时，它将调用此函数并将span id=“totalBig”变为其总和的值（big_1相加直到big_10）

下面是我编辑的额外代码：

<input type="number" data-bv-digits-message="true" data-bv-threshold="1" min="0" class="form-control" name="big_1" id="big_1" size="6">

<input type="number" data-bv-digits-message="true" data-bv-threshold="1" min="0" class="form-control" name="big_2" id="big_2" size="6">


all the way until big_10

一直到10岁

我想改变这个大的标识符（1-10）的值，它会把它加起来，改变我的

<div class="well">
Total Big: <span id="totalbig">0</span> &nbsp;&nbsp;&nbsp;&nbsp;</span> 
</div>

总数：0

我试过了

<script type="text/javascript">
$(document).ready(function() {
$('#html5Form').bootstrapValidator();
    $('.big').change(function() { 
        var bigAmt = "";

        $('.big').each(function () {
            bigAmt += $(this).val();    
        })

        var elem = document.getElementById("totalBig");
alert(bigAmt);
        elem.value = bigAmt;
    });
});
</script>

$（文档）.ready（函数（）{
$（'#html5Form'）。bootstrapValidator（）；
$（'.big'）.change（函数（）{
var bigAmt=“”；
$（'.big'）。每个（函数（）{
bigAmt+=$（this.val（）；
})
var elem=document.getElementById（“totalBig”）；
警报（bigAmt）；
元素值=大金额；
});
});

---

当任何大值被更改时，它不会运行任何警报。

如果在每个

中添加一个

big

类会更好。然后你可以这样做：

$(document).ready(function() {
    $('.big').change(function() { 
        var bigAmt = 0;

        $('.big').each(function () {
            bigAmt += Number($(this).val());    
        })

        $("#totalBig").val(bigAmt);
    });
});

这比你所拥有的更干净、更容易理解

为了使其工作，您需要向所有输入添加一个类：

<input type="number" data-bv-digits-message="true" data-bv-threshold="1" min="0" class="form-control big" name="big_2" id="big_2" size="6"><!-- Notice the big class-->

---

这是对所有输入进行分组的最佳方式。它们都是相关的，所以它们应该共享一个类。您不应该为如此相似的功能调用多个ID。

如果您在每个

中添加一个

大的
类，会更好。然后你可以这样做：

$(document).ready(function() {
    $('.big').change(function() { 
        var bigAmt = 0;

        $('.big').each(function () {
            bigAmt += Number($(this).val());    
        })

        $("#totalBig").val(bigAmt);
    });
});

这比你所拥有的更干净、更容易理解

为了使其工作，您需要向所有输入添加一个类：

<input type="number" data-bv-digits-message="true" data-bv-threshold="1" min="0" class="form-control big" name="big_2" id="big_2" size="6"><!-- Notice the big class-->



这是对所有输入进行分组的最佳方式。它们都是相关的，所以它们应该共享一个类。您不应该为如此相似的功能调用多个ID。
您监控所有输入类型文本上的更改事件，如下所示：

$('input:text').change(
function () {
    alert('text changed of any text box.');
    //You can doo your code here.
});

$('.yourclass').change(
function () {
    alert('text changed of any text box.');
    //You can doo your code here.
});

或者

如果要将监视器添加到任何选定的文本框中，则必须将任何css类添加到这些选定的文本框中，然后通过类监视这些文本框，如下所示：

$('input:text').change(
function () {
    alert('text changed of any text box.');
    //You can doo your code here.
});

$('.yourclass').change(
function () {
    alert('text changed of any text box.');
    //You can doo your code here.
});

更改文本后，如果文本框失去焦点，将触发此更改事件

但是，如果您想要失去焦点（意味着如果您想在键入时更新计数），那么您应该使用答案中所述的keyup事件。
您可以按如下方式监控所有输入类型文本上的更改事件：

$('input:text').change(
function () {
    alert('text changed of any text box.');
    //You can doo your code here.
});

$('.yourclass').change(
function () {
    alert('text changed of any text box.');
    //You can doo your code here.
});

或者

如果要将监视器添加到任何选定的文本框中，则必须将任何css类添加到这些选定的文本框中，然后通过类监视这些文本框，如下所示：

$('input:text').change(
function () {
    alert('text changed of any text box.');
    //You can doo your code here.
});

$('.yourclass').change(
function () {
    alert('text changed of any text box.');
    //You can doo your code here.
});

更改文本后，如果文本框失去焦点，将触发此更改事件

但是，如果您想要失去焦点（意味着如果您想在键入时更新计数），那么您应该使用答案中所述的keyup事件。
$（document）.ready（function（）{
$（'#big_1'）。更改（函数（）{
var divArray=[“big_1”、“big_2”、“big_3”、“big_4”、“big_5”、“big_6”、“big_7”、“big_8”、“big_9”、“big_9”、“big_10”]；
var-bigAmt=0；
对于（var i=0，n=divArray.length；i
$（document）.ready（function（））{
$（'#big_1'）。更改（函数（）{
var divArray=[“big_1”、“big_2”、“big_3”、“big_4”、“big_5”、“big_6”、“big_7”、“big_8”、“big_9”、“big_9”、“big_10”]；
var-bigAmt=0；
对于（var i=0，n=divArray.length；i向所有输入添加
class=“bigs”
，然后尝试以下操作：

$(document).ready(function () {
    var intTotalBig;
    $('.bigs').change(function () {
        intTotalBig = 0;
        $('.bigs').each(function(){
            $thisVal = $(this).val();
            if ($.isNumeric($thisVal)){
                intTotalBig += parseInt($thisVal, 10);
            }
        });
        $("#totalBig").val(intTotalBig);
    });
});

此代码检查每次更改的所有输入，并对所有具有数值的输入求和，忽略空值或无数值

将
class=“bigs”
添加到所有输入，然后尝试以下操作：

$(document).ready(function () {
    var intTotalBig;
    $('.bigs').change(function () {
        intTotalBig = 0;
        $('.bigs').each(function(){
            $thisVal = $(this).val();
            if ($.isNumeric($thisVal)){
                intTotalBig += parseInt($thisVal, 10);
            }
        });
        $("#totalBig").val(intTotalBig);
    });
});

此代码检查每次更改的所有输入，并对所有具有数值的输入求和，忽略空值或无数值

如果您正在使用jquery，请正确使用它，它将使您的生活更加轻松

在你的情况下，这将对你起作用

$(document).ready(function() {
    $('[id^="big"').change(function(){
        var total = (+$('#totalBig').val());
        var currentVal = (+$(this).val());
        total += currentVal;
        $('#totalBig').val(total)
    })
});

如果您正在使用jquery，请正确使用它，它将使您的生活更加轻松

在你的情况下，这将对你起作用

$(document).ready(function() {
    $('[id^="big"').change(function(){
        var total = (+$('#totalBig').val());
        var currentVal = (+$(this).val());
        total += currentVal;
        $('#totalBig').val(total)
    })
});

你能粘贴一些HTML吗：）也许是jsFiddle@Mritunjay，我对javascript和jquery非常陌生，我对php更为了解。我还在学习抱歉：）在格式化代码时，我注意到在
big_8
行之前有一个零散的
；
。这是你真正的代码吗？@JasonP，很抱歉，我在这里输入时输入了错误。我将删除多余的代码；附带的HTML代码将帮助我们确保其中没有错误。你能粘贴一些HTML:）也许是jsFiddle@Mritunjay，我对javascript和jquery非常陌生，我对php更为了解。我还在学习抱歉：）在格式化代码时，我注意到在
big_8
行之前有一个零散的
；
。这是你的真实代码吗？@JasonP，对不起，我输入这里时输入了错误。我将删除多余的代码；附带的HTML代码将帮助我们确保其中没有错误。我认为OP想要添加数字。你可能会vert
val（）的值
到int或浮点类型，这样您就不会意外地连接字符串。他想添加整数，而不是连接字符串。我尝试了您的解决方案，奇怪的是，当我更改时，它没有调用，因为我试图在var elem之前包含一个警报，它似乎不起作用，是的，我想添加整数您编辑了HTML吗？哟你必须将css类添加到输入元素中吗？我认为OP想要添加数字。你可以