2015-01-21 2 views
-2

나는 Javascript, HTML 등에서 절대적으로 멍청한 반응을 보입니다. 나는 직접적인 대답을 찾지 못했고 atleast를 알지 못하는 기본적인 질문을 가지고 있습니다. 이해.자바 스크립트 - 사용자로부터 입력을 받아서 출력을 표시하려면 어떻게해야합니까?

I 코드의 조각 만들었다

:

<script> 
var a = 500000; 
var b = 80; 
var c = (a-250000)*0.10; 
var d = (a-300000)*0.10; 
var e = Math.min(c,2000); 
var f = Math.min(d,2000); 

if (a > 250000 && a < 500001 && b < 60) { 
    document.write(e); 
} else if (a > 300000 && a < 500001 && b > 59 && b < 80) { 
    document.write(f); 
} else { 
    document.write("No Rebate"); 
} 
</script> 

제가 상기 사용자로부터 "A"와 "B"의 입력 값을 아래의 코드로 연산을 수행 한 결과를 표시 할 (E 또는 F를 또는 경우에 따라 환불하지 않음)을 설정해야합니다.

어떻게하면됩니까?

는 내가 지금까지 시도하면이

<form name="calc"> 
<table border="1" width="600" height="200" cellpadding="10" cellspacing="3"> 
<tr><th colspan="3"><h1>TESTING</h1></th></tr> 
<tr> <th><h3>INPUT</h3></th> 
<th><h3>AGE</h3></th> 
<th><h3>REBATE</h3></th></tr> 
<tr></tr> 
<td><input type="text" name="input1" id="input1" onchange="calculate();"/></td> 
<td><input type="text" name="input2" id="input2" onchange="calculate();"/></td> 
<td><input type="text" name="output" id="output"></td> 
<table> 
</form> 

<script type="text/javascript"> 
function calculate() { 

var a = document.calc.input1.value; 
var b = document.calc.input2.value; 
var c = (a-250000)*0.10; 
var d = (a-300000)*0.10; 
var e = Math.min(c,2000); 
var f = Math.min(d,2000); 

if (a > 250000 && a < 500001 && b < 60) { 
    document.calc.output.innerHTML = e; 
} else if (a > 300000 && a < 500001 && b > 59 && b < 80) { 
    document.calc.output.innerHTML = f; 
} else { 
    document.calc.output.innerHTML = "No Rebate" 
} 
</script> 

당신은 사용자 입력을 캡처하는 HTML 입력 요소를 만들 필요가

+0

console? 마디? 브라우저? 이 스크립트를 테스트하기 위해 사용중인 것을 알려주십시오. 그리고 시도한 것을 보여주십시오. – Pinoniq

+0

하나의 옵션은 텍스트 상자와 제출 단추로 구성된 양식이있는 HTML 문서를 만드는 것입니다. 제출 단추를 클릭하면 양식의 값을 저장하고 스크립트를 실행합니다. – kgh

답변

0

(내가 제대로 여기 .innerHTML을 사용하고 있지 않다 확신)입니다. 스크립트는 값을 읽고 버튼 클릭과 같은 일부 이벤트에서 계산을 수행해야합니다 (예 :

<html> 
    <head></head> 
    <body> 
    <p>Input value a: <input type="text" onchange="return calculate();" id="txtA" /></p> 
    <p>Input value b: <input type="text" onchange="return calculate();" id="txtB" /></p> 
    <p id="result"></p> 
    <script> 

    function calculate(){ 
     var a = document.getElementById('txtA').value; 
     var b = document.getElementById('txtB').value; 
     var c = (a-250000)*0.10; 
     var d = (a-300000)*0.10; 
     var e = Math.min(c,2000); 
     var f = Math.min(d,2000); 

     if (a > 250000 && a < 500001 && b < 60) { 
      document.getElementById('result').innerHTML = e; 
     } else if (a > 300000 && a < 500001 && b > 59 && b < 80) { 
      document.getElementById('result').innerHTML = f; 
     } else { 
      document.getElementById('result').innerHTML = "No Rebate"; 
     } 
     return false; 
    } 

    </script> 
    </body> 
</html> 
+0

출력에'document.write'를 사용해서는 안됩니다. 특히 OP에 텍스트 전용 출력이 필요하지 않는 한, 입력에 완벽하게 합당한'document.getElementById' 이후가 아닙니다. 또한'calculate()'는 아무 것도 반환하지 않으므로'return calculate()'는'undefined'를 반환합니다. – ssube

+0

습관으로 돌아왔다. 어쨌든 document.write()는 중요하지 않지만, OP는 이것이 바람직한 행동이라고 암시합니다. – Crowcoder

+0

감사합니다, 이것은 거의 내가 찾고 있던 것이지만, 내가 찾고있는이 코드에서 한 번 더 간단한 조작으로 세 번째 입력 상자에 출력을 표시하고 동일한 사용자가 입력 값을 변경하지 않을 때 계산을 다시 수행하는 방법 ? –

관련 문제