2017-01-10 12 views
0

Я пытаюсь создать опрос вопросов и ответов в зависимости от предыдущего вопроса. Поэтому, если пользователь нажимает «да», предыдущий вопрос исчезает с экрана, и на экране появляется новый вопрос, другой вопрос, если нет щелчка. Буду признателен за любую оказанную помощь. Спасибо.Многоуровневые ответы в зависимости от предыдущего запроса

Код:

<!DOCTYPE html> 
<html> 

<body> 

<p>Is the answer to this question Yes or No?</p> 
<button onclick="myFunction1()">Yes</button> 
<button onclick="myFunction2()">No</button> 
<p id="demo"></p> 

<script> 
function myFunction1() { 
} 
function myFunction1() { 
} 

</script> 
</body> 
</html> 

ответ

0

Самый простой способ сделать это с помощью свойства отображения CSS, как это:

<!DOCTYPE html> 
 
<html> 
 

 
    <body> 
 
    <div id="first-question"> 
 
     <p>Is the answer to this question Yes or No?</p> 
 
     <button onclick="myFunction('first-question', 'second-question-1')">Yes</button> 
 
     <button onclick="myFunction('first-question', 'second-question-2')">No</button> 
 
    </div> 
 
    <div id="second-question-1" style="display: none;"> 
 
     <p>You have clicked "Yes"</p> 
 
     <p>Return to the first question ?</p> 
 
     <button onclick="myFunction('second-question-1', 'first-question')">Yes</button> 
 
     <button onclick="">No</button> 
 
    </div> 
 
    <div id="second-question-2" style="display: none;"> 
 
     <p>You have clicked "No"</p> 
 
    <p>Return to the first question ?</p> 
 
     <button onclick="myFunction('second-question-2', 'first-question')">Yes</button> 
 
     <button onclick="">No</button> 
 
    </div> 
 

 

 
    <script type="text/javascript"> 
 
     function myFunction (hide, show) { 
 
     document.getElementById(hide).style.display = "none"; 
 
     document.getElementById(show).style.display = "block"; 
 
     } 
 

 
    </script> 
 
    </body> 
 

 
</html>

UPDATE: использовать только 1 функцию

+0

похоже на то, что я ищу, но что ppens, если мне нужно 5 уровней вопросов? поэтому число вопросов становится 2^n (n - уровень)? – sphe2011

+0

Ну ... У вас будет много элементов div, со многими id. Вы можете использовать только одну функцию js, отправив идентификатор в параметр. – AntoineCa

+0

функция myFunction3() { \t document.getElementById ("first-question"). Style.display = "none"; \t document.getElementById ("второй вопрос-2"). Style.display = "none"; document.getElementById ("третий вопрос-1"). Style.display = "block"; } Показывает второй вопрос. – sphe2011