2016-08-20 8 views
0

나는 이것으로 간단한 수학을하려고합니다. 내가 가진 문제는 그 결과가 결코 나타나지 않는다는 것입니다.입력에 값 추가

HTML

<!DOCTYPE html> 
<html> 
<head> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js" ></script> 
    <script type="text/javascript" src="script.js"></script> 
    <title></title> 
</head> 
<body> 
    <form> 
     <input id="data1" type="number" name="data1"> 
     <br> 
     <input id="data2" type="number" name="data2"> 
     <br> 
     <input id="button" type="submit"> 
     <br> 
     <br> 
     <input id="result" type="number" name="result" value="1"> 
    </form> 
</body> 
</html> 

JS : 여기 내 변수를 얻었다. 방정식의 결과는 #result 입력에 표시되어야합니다.

$(document).ready(function(){ 

    var result = 0; 
    $("#result").val(result); 

    $("#button").click(function() { 

     var data1 = $("#data1").val(); 
     var data2 = $("#data2").val(); 

     result = $(data1 * data2); 

     $("#result").val(result); 

    }); 

}); 

답변

0

result는 객체에

result = $(data1 * data2); 

변화가있을 것입니다. 다른 의견에서 제안했듯이 preventDefault()

$(document).ready(function(){ 
    var result = 0; 
    $("#result").val(result); 

    $("#button").click(function(evt) { 
     evt.preventDefault(); 
     var data1 = $("#data1").val(); 
     var data2 = $("#data2").val(); 

     result = data1 * data2;  
     $("#result").val(result); 
    }); 
}); 
+0

에 전화를 추가하는 것을 잊지 마세요. 감사! – notooanon

2

페이지가 제출 및 다시로드되지 않도록하려면 기본값을 추가하십시오.

$(document).ready(function(){ 

var result = 0; 
$("#result").val(result); 

$("#button").click(function(evt) { 
    evt.preventDefault(); 
    var data1 = $("#data1").val(); 
    var data2 = $("#data2").val(); 

    result = $(data1 * data2); 

    $("#result").val(result); 

}); 

}); 
0

form에는 몇 가지 기본 매개 변수가 있습니다. 그것은 당신이하는 것처럼 그것에 아무 것도 전달하지 않더라도 그것을 가지고 있습니다. 예를 들어 action입니다. 기본값은 현재 사용중인 사이트입니다. 따라서 제출 버튼을 클릭하면 양식이 제출됩니다 (GET 요청 - 다른 기본값입니다 - 현재있는 URL로). 아무리 적은 매개 변수를 전달하더라도 상관 없습니다. 이 일을 방지하기 위해. preventDefault() 방법을 사용할 수 있습니다.

$("#button").click(function(e) { 
    e.preventDefault(); 
    // ... rest of your code 
} 

정말 데이터/양식/자체를 제출에서 양식을 중지합니다 - 당신은 같은 페이지에 JS와의 값을 처리 할 수 ​​있습니다. 코드의 나머지 부분이 잘 보이는

result = data1 * data2; 

: 당신의 다음 조각에서

관련 문제