2011-02-20 3 views
0

기본 양식 작업의 경우 제출 버튼과 두 번째 작업을위한 추가 버튼이 필요합니다.HTML 양식 제출에 자바 스크립트 출력이 표시되지 않습니다.

나는 다음과 같은 코드를 가지고 : 나는 예상대로

<html> 
<head><title></title> 
<?PHP 
$Input = ""; 
if(isset($_POST['Input'])) $Input = $_POST['Input']; 
?> 
</head> 

<body> 
    <FORM id ="form1" method="post"> 
     Input: <INPUT TYPE = "TEXT" VALUE ="<?php echo $Input;?>" NAME = "Input" SIZE="3"> 
     <INPUT TYPE = "submit" id = "action1" VALUE = "action 1"> 
     <INPUT TYPE = "button" id = "action2" VALUE = "action 2"> 
    </FORM> 
    <br> 

    <script type="text/javascript"> 
     var form = document.getElementById('form1'); 

     form.onsubmit = function() { 
      document.getElementById("php_code_action1").innerHTML="<?php echo "action 1<br>"; ?>"; 
      document.getElementById("php_code_action2").innerHTML=""; 
     }; 

     document.getElementById('action2').onclick = function() 
     {  
      document.getElementById("php_code_action2").innerHTML="<?php echo "action 2<br>"; ?>"; 
      document.getElementById("php_code_action1").innerHTML=""; 
     } 
    </script> 

    <span id="php_code_action1"> </span> 
    <span id="php_code_action2"> </span> 

</body> 
</html> 

조치 2 버튼에 클릭이 작동을하지만, "조치 1"버튼을 클릭하여 페이지 새로 고침 및 조치 1 사라의 출력을 가지고있다.

새로 고치는 이유는 무엇이며 어떻게 조치 1의 출력을 표시 할 수 있습니까?

+0

이것은 다소 혼란스러운 질문입니다. HTML, Javascript 또는 PHP에 관한 것입니까? 한 기술에 대한 질문을 좁힐 수 있습니까? –

+0

네가 맞아 : 나는 혼란 스러웠다. 문제는 html 또는 javascript (PHP가 아님)입니다. 당신이 자바 스크립트 부분에 대한 수정을했다. 당신의 도움을 주셔서 감사합니다. – tucson

답변

4
form.onsubmit = function() { 
    document.getElementById("php_code_action1").innerHTML="<?php echo "action 1<br>"; ?>"; 
    document.getElementById("php_code_action2").innerHTML=""; 
    return false; 
}; 
1

onsubmit 처리기에 return false;을 작성하여 양식 제출과 같은 일반적인 작업을 방지 할 수 있습니다. 그런 다음 페이지를 새로 고침해서는 안됩니다.

관련 문제