입력 한 데이터 요약

예를 들어, html에 표시된대로 고객 이름, 전자 메일, 주문을 요청할 것입니다.

제출을 클릭하면 나를 2 페이지로 연결합니다. 그러면 2 페이지와 같이 요약 할 수있는 창이 나타납니다.

Customer name: xxxxxxx 
Email: xxxxxxx 
No of quantity ordered for item A:xx 
No of quantity ordered for item B:xx 
No of quantity ordered for item C:xx 
Total cost:xx

HTML :

<!DOCTYPE html> 
<html lang = "en"> 
<head> 
<title> nochange.html </title> 
<meta charset = "utf-8" /> 
    <script type = "text/javascript" src = "dynValue.js" > 
</script> 
<style type = "text/css"> 
    textarea {position: absolute; left: 250px; top: 0px;} 
    span {font-style: italic;} 
    p {font-weight: bold;} 
    td, th, table {border: thin solid black;} 
</style> 

</head> 
<body> 
     <form action = ""> 
    <p> 
    <span> 
     Customer information 
    </span> 
    <br /><br /> 
    <label> 
     Name: 
     <input type = "text" onmouseover = "messages(0)" 
      onmouseout = "messages(4)" /> 
    </label> 
    <br /> 
    <label> 
     Email: 
     <input type = "text" onmouseover = "messages(1)" 
      onmouseout = "messages(4)" /> 
    </label> 
    <br /> <br /></p> 
</form> 
<form action = ""> 
    <h3> Order Form </h3> 

    <table> 
    <tr> 
     <th> Product Name </th> 
     <th> Price </th> 
     <th> Quantity </th> 
    </tr> 

    <tr> 
     <th> French Vanilla (1 lb.) </th> 
     <td> $3.49 </td> 
     <td> <input type = "text" id = "french" 
        size ="2" /> </td> 
    </tr> 
    <tr> 
     <th> Hazlenut Cream (1 lb.) </th> 
     <td> $3.95 </td> 
     <td> <input type = "text" id = "hazlenut" 
      size = "2" /> </td> 
    </tr> 
    <tr> 
     <th> Columbian (1 lb.) </th> 
     <td> $4.59 </td> 
     <td> <input type = "text" id = "columbian" 
      size = "2" /></td> 
    </tr> 
    </table> 


    <p> 
    <input type = "button" value = "Total Cost" 
      onclick = "computeCost();" /> 
    <input type = "text" size = "5" id = "cost" 
      onfocus = "this.blur();" /> 
    </p> 


    <p> 
    <input type = "submit" value = "Submit Order" /> 
    <input type = "reset" value = "Clear Order Form" /> 
    </p> 
</form> 
</body> 
</html>

JS :

var helpers = ["Your name must be in the form: \n \ 
first name, middle initial., last name", 
"Your email address must have the form: \ 
[email protected]",] 

function messages(adviceNumber) { 
document.getElementById("adviceBox").value = 
           helpers[adviceNumber]; 
} 
function computeCost() { 
var french = document.getElementById("french").value; 
var hazlenut = document.getElementById("hazlenut").value; 
var columbian = document.getElementById("columbian").value; 

document.getElementById("cost").value = 
totalCost = french * 3.49 + hazlenut * 3.95 + 
      columbian * 4.59; 
}

출처

2014-04-07 user3505324

totalCost를 계산하여 표시합니다. 이것을 확인하십시오 http://jsfiddle.net/QSLsF/ – Jayesh

옙 ..하지만 어떻게 고객으로부터 입력을 캡처하고 항목을 포함한 데이터 입력 + 전체 비용은 내 질문에 언급 된 것처럼 갑니까? – user3505324

helpers [] 배열에는 요소가 3 개뿐입니다. – Sam

내가 그것을 프랑스어, hazlenut와 콜럼버스로 처리되고 있다는 사실을 함께 할 수있는 뭔가가 생각 코드의 문자열. totalCost 계산을 수행하기 전에 각각에 대해 parseInt를 사용해보십시오.

html 5 이상을 사용하는 경우 입력 유형 = 텍스트가 아닌 입력 유형 = 숫자로 벗어날 수 있습니다.

출처

2014-04-07 18:40:56 user2514231

주 페이지의 사용자가 입력 한 데이터를 캡처하여 두 번째 페이지에 표시하려면 <form method="post" action="second.php">을 사용하여 양식을 제출 한 다음 second.php에서 해당 값을 가져 와서 필요에 따라 표시해야합니다.

이 작업을 수행하려면 각 ''양식 요소에서 'name'속성을 사용해야합니다. 예 :

<input type = "text" size = "5" id = "cost" name="cost" onfocus = "this.blur();" />

출처

2014-04-07 18:47:25 Jayesh

입력 한 데이터 요약

답변

관련 문제