Mảng Javascript Sum

Question

Làm thế nào tôi có thể tổng hợp các giá trị được điền vào mảng unitprice bằng cách sử dụng javascript Đây là html của tôi.

<td> 
     <input type="text" style="width: 60px; background: none repeat scroll 0% 0% rgb(255, 255, 255);" maxlength="4" id="unitprice" name="unitprice[]"> 
    </td> 
    <td> 
     <input type="text" style="width: 60px; background: none repeat scroll 0% 0% rgb(255, 255, 255);" maxlength="4" id="unitprice" name="unitprice[]"> 
    </td> 

Answer 1

Thay đổi HTML của bạn để sử dụng class thay vì id (id phải là duy nhất):

<td> 
    <input type="text" 
     style="width: 60px; background: none repeat scroll 0% 0% rgb(255, 255, 255);" maxlength="4" 
     class="unitprice" name="unitprice[]"> 
</td> 
<td> 
    <input type="text" 
     style="width: 60px; background: none repeat scroll 0% 0% rgb(255, 255, 255);" 
      maxlength="4" class="unitprice" name="unitprice[]"> 
</td> 

Sau đó, bạn có thể tổng qua JavaScript (sử dụng jQuery .each() chức năng):

var totalUnitPrice = 0; 

$('.unitprice').each(function(index) { 
    totalUnitPrice += parseInt($(this).val()); // parse the value to an Integer (otherwise it'll be concatenated as string) or use parseFloat for decimals 
    }); 

Answer 2

function getSum(){ 
    var ups = document.getElementsByName('unitprice[]'), sum = 0, i; 
    for(i = ups.length; i--;) 
     if(ups[i].value) 
      sum += parseInt(ups[i].value, 10); 
    return sum; 
} 

Answer 3

Tặng <input> s id duy nhất của bạn ke này:

<input type="text" id="unitprice_1"> 
<input type="text" id="unitprice_2"> 
<input type="text" id="unitprice_3"> 

Sau đó tính tổng:

var i = 1; 
var sum = 0; 
var input; 
while((input = document.getElementById('unitprice_'+i)) !== null) { 
    sum += parseInt(input.value); 
    ++i; 
} 
alert(sum); 

Answer 4

Nếu bạn có thể nhận được các giá trị trong một mảng, bạn không cần phải sử dụng jQuery để tổng hợp chúng. Bạn có thể sử dụng các phương thức đã có trên đối tượng mảng để thực hiện công việc.

Mảng có phương thức .reduce(). Tài liệu: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Array/Reduce

Array.reduce chấp nhận hàm làm đối số hoạt động như một cuộc gọi lại tích lũy. Hàm accumulator chấp nhận 4 đối số (previousValue, currentValue, index, array). Bạn chỉ cần 2 trong số họ để tổng hợp. 2 đối số đó là trướcValue và currentValue.

Nếu bạn gặp phải vấn đề về tính tương thích khi môi trường đích không hỗ trợ ECMAScript 5 trở lên, hãy sử dụng định nghĩa mẫu được xác định trong bài viết MDN được liên kết. (Được đính kèm bên dưới)

if (!Array.prototype.reduce) { 
    Array.prototype.reduce = function reduce(accumulator){ 
    if (this===null || this===undefined) throw new TypeError("Object is null or undefined"); 
    var i = 0, l = this.length >> 0, curr; 
    if(typeof accumulator !== "function") // ES5 : "If IsCallable(callbackfn) is false, throw a TypeError exception." 
     throw new TypeError("First argument is not callable"); 
    if(arguments.length < 2) { 
     if (l === 0) throw new TypeError("Array length is 0 and no second argument"); 
     curr = this[0]; 
     i = 1; // start accumulating at the second element 
    } 
    else 
     curr = arguments[1]; 
    while (i < l) { 
     if(i in this) curr = accumulator.call(undefined, curr, this[i], i, this); 
     ++i; 
    } 
    return curr; 
    }; 
}