Question

我无法让我的测验工作。我试图使用前两个回答[0,1]来结束测验，并将它们发送到特定的div，这将向他们展示有关婚礼/教学的更多信息。我尝试将输入字段与响应进行比较，但它继续过滤掉剩下的问题，这是我不想要的。我是新手，我没有看到我的错误任何帮助将不胜感激。

codepen practice

    <div class="quiz-holder">
      <p>QUIZ</p>
      <h3><div class="question"></div></h3>
      <strong><div class="message"></div></strong>
      <div class="choiceList"></div>
      <button class="nextButton">Next</button>
      <button id="reset">Start over</button>

      </div>
      <div class="teacher">
      </div>
<div class="wedding">
      </div>


  //all the questions and answers
var questions = [{
  question: "Tell us a little about yourself...",
  choices: [
    "I'm a teacher", "I'm getting married", "I'm still in school ", "I'm a busy professional",
    "I'm a planner nerd", "I go with the flow", "I love traveling"
  ],
  response: ["0", "1"]
}, {
  question: "Do you want a calendar?",
  choices: ["Yes, I want a calendar!", "No, I don't want a calendar."],
}, {
  question: "You said you would like a calendar. What would you like to do with your book?",
  choices: ["I want to use it for memory keeping - even if I don't have a schedule to manage, I still write things down.", "I want to keep track of my routines & schedule hour by hour.", "I want to keep my family's schedule in one place.", "I want to plan out the big things on a monthly spread, but the detailed planning consists more of notes & lists.", "I want to keep track of projects, assignments, and notes.", "I want to manage a budget and  stay on top of everything.", "I want to log my daily tasks, events and daily notes in bullet format.", "I want to keep a detailed log my tasks, events, and daily notes in long-form format.", "I want to write down my ideas, thoughts & notes while out and about.", "Actually, I don't want a calendar."]
}, {
  question: "You said you do not want a calendar. What would you like to do with your book?",
  choices: ["Fill up the pages with my passions", "Take notes & tackle my tasks", "Let my creativity flow!", "Actually, I really do want a calendar."]
}, {
  question: "What's your planning style?",
  choices: ["an extra response here?", "Detailed: I need a monthly view for the big things and a weekly view where I plan each day by the hour.", "Categorized: I separate each day into a category (work, personal, home, for example) to have a clear view of my goals.", "Goal Oriented: My schedule's pretty set so I just write down reminders for the few important things I need to do that day.", "Assignment Driven: I need to plan out my month, schedule my weeks and have a dedicated project/assignment section so I can get things done.", "Task Driven: I plan the big things month by month but I like to break down special projects, ideas & tasks in my notes.", "Creative: I need a customized creative space to sort my thoughts and plan things in my style with plenty of room for snap-in accessories.", "On-The-Go: I just need something pretty & portable that fits in my bag for quick notes."]
}];


    $("#reset").hide(); //to hide the start over button until the end
    $(".message").hide(); //to hide message div
    var currentQuestion = 0; //keeps track of the question
    $('.teacher').hide();
    $('.wedding').hide();//only to be shown when the first question is filtered out. 

    var questionSpecific = questions[currentQuestion].choices;

    function displayCurrentQuestion() {

      var question = questions[currentQuestion].question;

      var questionClass = $(".question");

      var choiceList = $(".choiceList");

      var numChoices = questions[currentQuestion].choices.length;

      // the question is put into the question div.
      $(questionClass).text(question);

      // Remove all current <div> elements from previous questions
      $(choiceList).find("div").remove();

      var choice;
      for (i = 0; i < numChoices; i++) {
        choice = questions[currentQuestion].choices[i];
        $("<div><input type='radio' value=" + i + " name='input'>" + choice + "</div>").appendTo(choiceList);
      }
    }

    $(document).ready(function() {

          // Display the first question
          displayCurrentQuestion();
          $(".message").hide();

          // On clicking next, display the next question
          $(".nextButton").on("click", function() {

            value = $("input:checked").val();

            if (value === undefined) {
              $(".message").text("Please select an answer").css('color', 'red');
              $(".message").show();
            } else {
              $(".message").hide();
              currentQuestion++; 
              if (currentQuestion < questions.length) {
                displayCurrentQuestion();
            }};

            if (value === questions[0].response[0]) {
              console.log('why isnt this working?');
            };

            if (value === questions[0].response[1]) {
              console.log('WHY!?');
            };

        }); 
    });

JQuery过滤掉对象

0 个答案: