자바 스크립트 배열 합계

Question

어떻게 자바 스크립트를 사용하여 unitprice 배열에 채워진 값을 요약 할 수 있습니까 여기 내 HTML입니다.

<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

이 (고유해야합니다 id) class 대신 id를 사용하도록 HTML을 변경

:

<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> 

이 그럼 당신은 자바 스크립트를 통해 총 수 (사용 jQuery를 .each() 기능) :

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

<input>님께 고유 한 아이디를주세요. li KE이 : ​​당신이 배열의 값을 얻을 수있는 경우

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

Answer 4

, 당신은 그 합계를 jQuery를 사용할 필요가 없습니다 :

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

그런 다음 합계를 계산합니다. 배열 객체에 이미있는 메소드를 사용하여 작업을 수행 할 수 있습니다.

배열에는 .reduce() 메소드가 있습니다. 문서 : https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Array/Reduce

Array.reduce는 누적 기 콜백의 역할을하는 인수로 함수를 받아들입니다. accumulator 함수는 4 개의 인수 (previousValue, currentValue, index, array)를 허용합니다. 당신은 그 중 2 개만 합쳐야합니다. 그 2 개의 인수는 previousValue와 currentValue입니다.

var sampleArray = [1, 2, 3, 4, 5]; 
var sum = sampleArray.reduce(function(previousValue, currentValue){ 
    return currentValue + previousValue; 
}); 

대상 환경이 링크 된 MDN 문서에 정의 된 프로토 타입 정의를, ECMAScript를 5 이상 추가를 지원 사용하지 않는 호환성 문제에 직면하는 경우. (아래에 추가)

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; 
    }; 
}