자바 스크립트를 사용하여 목록의 총계를 얻는 방법

Question

나는 온라인 배달 웹 페이지의 코드를 만들고 있는데, 사용자가 주문한 목록의 합계를 출력하는 방법을 알아 내려고 노력하고 있습니다.

function ListOrder(){ 
     document.getElementById('order').innerHTML += "<div id=\"YourOrders\">" + + document.getElementById('FoodName').value + document.getElementById('quantity').value + document.getElementById('Totality').value + "</div><br>";} 

편집 : 전체 가격의 합계를 어떻게 얻을 수 있는지 알고 싶습니다. 그래서 document.getElementById ('Totality'). value 사이에 parseInt를 배치했습니다. 지금이 모양 인 것 같습니다.

function ListOrder(){ 
     document.getElementById('order').innerHTML += "<div id=\"YourOrders\">" + + document.getElementById('FoodName').value + document.getElementById('quantity').value + parseInt(document.getElementById('Totality').value) + "</div><br>";} 

누군가가 나를 위해 어떤 기능을 수행하도록 도와 줄 수 있습니까? Javascript 만 해주세요. 나는 아직도 조금 새로운 것입니다. 당신이 출력 주문을 할 당신이 제안하는 방식으로 질문을 말로 표현했습니다

function ListOrder(){ 
    document.getElementById('order').innerHTML += 
      "<div id=\"YourOrders\">" + (
       document.getElementById('FoodName').value 
       + document.getElementById('quantity').value 
       + document.getElementById('Totality').value 
     ) 
     + "</div><br>" 
    ; 
} 

:

Answer 1

function ListOrder(){ 
    document.getElementById('order').innerHTML += 
    "<div id=\"YourOrders\">" + 
    parseInt(document.getElementById('FoodName').value) + 
    parseInt(document.getElementById('quantity').value) + 
    parseInt(document.getElementById('Totality').value) + 
    "</div><br>"; 
} 

Answer 2

코드의 커널은 다음 (포맷 삭제를 두 번 + 연산자)과 같아야합니다 특정 id를 가진 모든 (html) 요소의 내용으로 구성된 목록.

이 안정적으로 작동하지 않습니다

• ID는 서로 문서화해야한다.
• 사용하는 Js 함수는 목록을 반복하지 않습니다.

대신, 당신은 jquery 가져 가정 다음 줄 (함께 진행 크로스 브라우저 DOM-처리하고 :) 어쨌든 사용해야 아약스 라이브러리() :

function ListOrder(){ 
    var e_orders = $("<div id=\"YourOrders\">"); 
    $("#order").append(e_orders); 

    $(".FoodName").each (function (idx_fn, e_fn) { 
     $(e_orders).append(
      $("<div/>").append(
       $(e_fn).val() 
       + $(e_fn).nextAll('.quantity').val() 
       + $(e_fn).nextAll('.Totality').val() 
      ); 
     ); 
     $(e_orders).append("<br>"); 
    }); 

    return e_orders; 
} 

코드 템플릿은 소스 데이터가 속성을 가진 요소이고 css 클래스 quantity, Totality 및 'FoodName`으로 표시되어 이러한 요소는 형제이며 각 항목 incl의 컨테이너 요소 내에서 고유하다고 가정합니다. 수량 정보. 실제 요구 사항 및 html 구조에 맞게 조정할 수있을만큼 유연해야합니다.