2015-02-01 3 views
1

나는 초보자 코더이며이 퀴즈 형식 프로그램을 작성 중입니다. 미리 작성된 질문을 한 다음 올바른 답을 얻었는지 확인하고 실행 점수를 조정 한 후 다음 문제를 표시해야합니다. 나는 그 밖의 모든 것을 마쳤지 만, 나를 붙잡고있는 부분은이 부분입니다.점수/퀴즈 게임 실행

<!doctype html> 
 
    
 
    <html lang="en"> 
 
    <head> 
 
     <title>Group Project</title> 
 
    </head> 
 
    <body> 
 
     <script text="text/javascript"> 
 
      var a = 0; 
 
      var b = 0; 
 
      document.write(a, "/", b) 
 
      function score() { 
 
       
 
      
 
      var a = 0; 
 
      var b = 0; 
 
       
 
      if (document.question.one.value=="10") { 
 
       ++a; 
 
       ++b; 
 
       
 
      } 
 
      else{ 
 
       ++b; 
 
       
 
      } 
 
      document.write(a, "/", b) 
 
      } 
 
     </script> 
 
     
 
     
 
     <form name="question"><br> 
 
      <input type="text" name="one"/><br> 
 
      <input type="button" value="Submit" onclick="score()" /> 
 
      
 
      
 
     </form>

난 그냥 볼 수있는 IF 문 (10)를 고른 증가가 작동하지만 내가 텍스트 입력에 입력 (10)을 보여주는 페이지를 다시로드는 만 생성 부분을 일입니다 버튼이나 텍스트 입력이 없습니다. 스코어 또는 분수가 실행되도록하려면 어떻게해야합니까? 그리고 페이지를 새로 고침 할 필요가 없습니다.

답변

0

document.write을 사용하지 않으려는 경우 새 콘텐츠를 작성하기 위해 모든 문서가 지워집니다. 대신 div과 같은 일부 DOM 요소의 내부 텍스트 내용을 변경해야합니다. 예를 들어 :

<form name="question"> 
 
    <div id="score"></div> 
 
    <input type="text" name="one" /> 
 
    <br> 
 
    <input type="button" value="Submit" onclick="score()" /> 
 
</form> 
 

 
<script text="text/javascript"> 
 
    var a = 0; 
 
    var b = 0; 
 
    
 
    write(a, b); 
 

 
    function score() { 
 

 
     var a = 0; 
 
     var b = 0; 
 

 
     if (document.question.one.value == "10") { 
 
      ++a; 
 
      ++b; 
 
     } else { 
 
      ++b; 
 
     } 
 
     write(a, b); 
 
    } 
 
    
 
    function write(a, b) { 
 
     document.getElementById('score').innerHTML = a + "/" + b; 
 
    } 
 
</script>

위의 코드에서 나는 div#score 사업부의 범위 텍스트를 표시 도우미 함수 write을 소개했다.

함수가 div#score이 실행될 때 찾을 수 있도록 (HTML은 그 시간까지로드되어야 함) 양식 요소 뒤에 스크립트가 추가됩니다.

+0

이 방법이 효과가있는 것 같습니다. 그러나 버튼을 두 번 이상 누르면 1/1 또는 0/1로 유지됩니다. 어떻게하면 버튼을 클릭 할 때마다 0/2 또는 2/2 등으로 갈 수 있다고 생각하십니까> – SaltySoltas

+0

'점수'기능의 논리를 변경해야합니다. – dfsq

+0

당신은 논리를 바꾸기 위해 나를 올바른 방향으로 이끌 수 있다고 생각합니까? EventListener가 필요합니까? @ dfsq – SaltySoltas

1

위의 답변 외에도 다음을 권장합니다. 프로그래밍 방식으로 페이지 내용을 수정하는 경우 일반적으로 클리너/직관적 인 인터페이스를 제공하는 라이브러리를 사용하여 시간을 절약 할 수 있습니다. 이 목적을위한 하나의 공통 라이브러리는 jQuery입니다 : http://jquery.com/