JavaScript로 동적 인보이스를 작성하려고합니다.

Question

저는 매우 새로운 JavaScript 초보자입니다. "항목 수 없음"x "항목 비용"= "합계를 입력하면 동적 인보이스를 만들려고합니다. ". 현재 모든 값은 0으로 초기화됩니다.

꽤 많이 있습니다. 나는 지금 html과 통합하려고하는 단계에있다. 그래서 여기 샘플 코드가있다. (나는 부트 스트랩 기반의 폼에서 html 코드를 얻었고, 창의적이 되려고 노력하지 않고있다. 양식 대화 형).

아래 부분합과 총계는 무시하십시오. 도착하면 다리를 건너 죠. 많은 감사합니다 :) 코드는 다음과 같습니다 :

당신은 그 두 개의 입력 필드의 제품을 계산하는 기능을 실행하는 keyup의 가격과 수량 입력 모두를 설정하면

[link] http://codepen.io/ascdesignstudio/pen/JKvQoq 

Answer 1

, 당신은 세 번째 입력에 그 값을 할당 할 수 있습니다.

var totalPrice = function() { 
 
    // get the value of the price input 
 
    var price = document.getElementById("inputPrice").value 
 
    //get the value of the quantity input 
 
    var quantity = document.getElementById("inputNoOfItems").value 
 
    // assign the product of the above two inputs to the total 
 
    document.getElementById("inputTotal").value = price * quantity 
 
}

<span>Item Name</span> 
 
<!-- on keyup of both of these inputs, run a function to determine the total --> 
 
<input type="text" id="inputNoOfItems" value="0" onkeyup="totalPrice()"> 
 
<input type="text" id="inputPrice" value="0" onkeyup="totalPrice()"> 
 
<input type="text" id="inputTotal" value="0">

updated codepen