javascript - 在 jQuery 中，如何使用一个按钮从一个表单转到下一个表单(即，像调查问卷一样)

Question

这是问卷开始时我的 HTML:

<form id="questionnaire">
  Question 1: Do you like dogs?<br>
  <input type="radio" name="answer" value="yes">Yes<br>
  <input type-"radio" name="answer" value="no">No<br>
  <input type="submit" value="Next Question" />
</form>

到目前为止，这是我的 Javascript:

$(document).ready(function(){

    var q2 = 
      'Question 2: Do you like cats?
       <input type="radio" name="answer" value="yes">Yes<br>
       <input type-"radio" name="answer" value="no">No<br>
       <input type="submit" value="Next Question" />'

      $('#questionnaire').submit(function(){
        $('#questionnaire').html(q2); // This puts the Question 2 HTML into the form
        return false;
      });


    var q3 = 
      'Question 3: Do you like bunnies?
       <input type="radio" name="answer" value="yes">Yes<br>
       <input type-"radio" name="answer" value="no">No<br>
       <input type="submit" value="Next Question" />'
});

我应该编写什么样的函数，以便在问题 2 加载后，单击“下一个问题”按钮可以转到问题 3？

Answer 1

Fiddle

Javascript:

    var questions = ['Question 1: Do you like dogs?<br><input type="radio" name="answer" value="yes">Yes<br><input type-"radio" name="answer" value="no">No<br><input type="submit" value="Next Question" />', 'Question 2: Do you like cats?<input type="radio" name="answer" value="yes">Yes<br><input type-"radio" name="answer" value="no">No<br><input type="submit" value="Next Question" />','Question 3: Do you like bunnies?<input type="radio" name="answer" value="yes">Yes<br><input type-"radio" name="answer" value="no">No<br><input type="submit" value="Next Question" />'];

$('#questionnaire').html(questions[0]);
var currIdx = 0;

$(document).ready(function(){


      $('#questionnaire').submit(function(){
        currIdx++;
        $('#questionnaire').html(questions[currIdx]); // This puts the Question 2 HTML into the form
        return false;
      });

});​

HTML:

<form id="questionnaire">

</form>​