2017-02-23 4 views
2

Ich glaube, ich habe eine funktionierende Javascript-Funktionen, die eine Liste von Fragen und Entscheidungen auf einer einzigen Seite generieren sollte, aber nicht ausgeführt wird und keine Fehler auf Chrome-Konsole ausgeführt werden.Javascript wird nicht vom Array generiert

-Am Moment Ich habe zwei Funktionen Funktion createQuestions & createChoices -Ich habe tun einige zusätzliche Variablen an der Spitze für den späteren Stadien, aber ich will jetzt nur die Fragen und Antworten angezeigt werden soll.

//end screen counters 
 
var incorrectCounter = 0; 
 
var correctCounter = 0; 
 
var notAnsweredCounter = 0; 
 
var quiz = $('#quiz'); 
 
var index = 0; 
 

 
//empty array to push each selected answer to 
 
var userGuess = []; 
 
var answerKey = ["html", "css", "jquery", "none of the above"]; 
 

 

 

 
//function that runs the questions and possible choices at start up 
 
$(window).ready(function startUp() { 
 

 
    //all questions and choices are in a large array 
 
    var questionArray = [{ 
 
    questions: "what did we learn in week 1?", 
 
    //smaller array within the large array for each possible answer for each question 
 
    choices: ["html", "css", "jquery", "javascript", "none of the above"] 
 
    }, { 
 
    questions: "what did we learn in week 2?", 
 
    choices: ["html", "css", "jquery", "javascript", "none of the above"] 
 
    }, { 
 
    questions: "what did we learn in week 4?", 
 
    choices: ["html", "css", "jquery", "javascript", "none of the above"] 
 
    }, { 
 
    questions: "what did we learn in week 5?", 
 
    choices: ["html", "css", "jquery", "javascript", "none of the above"] 
 
    }]; 
 

 
    function createQuestions(index) { 
 
    var trivia = $('<div>', { 
 
     id: 'question' 
 
    }); 
 

 
    var header = $('<h2>Question ' + (index + 1) + ':</h2>'); 
 
    trivia.append(header); 
 

 
    var question = $('<p>').append(questions[index].question); 
 
    trivia.append(question); 
 

 
    var radioButtons = createChoices(index); 
 
    trivia.append(radioButtons); 
 

 
    return trivia; 
 
    index++; 
 

 
    } 
 

 
    function createChoices(index) { 
 
    var radioList = $("<ul>"); 
 
    var item; 
 
    var input = ""; 
 
    for (i = 0; i < questionArray[index].choices.length; i++) { 
 
     item = $('<li>'); 
 
     input = '<input type="radio" name="answer" value=' + i + ' />'; 
 
     input += question[index].choices[i]; 
 
     item.append(input); 
 
     radioList.append(item); 
 
    } 
 
    return radioList; 
 
    index++; 
 
    } 
 

 
    //End of the start up function 
 
});
<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title>Trivia Game: Easy Ver.</title> 
 
    <link href="assets/images"> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
    <link href="assets/css/style.css" rel="stylesheet" type="text/css"> 
 
    <!--Here is the jquery code --> 
 
    <script src="https://code.jquery.com/jquery-2.2.4.js" integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI=" crossorigin="anonymous"></script> 
 
</head> 
 

 
<body> 
 

 
    <!--Start of main container --> 
 
    <div id="maincontainer" class="container"> 
 
    <h1>Basic Trivia Game</h1> 
 

 
    <div> 
 
     Time Remaining: 
 
     <p id="timerDiv">00:00 Test</p> 
 
    </div> 
 

 
    <div class="container weekDiv"> 
 

 
     <p id="quiz">still a test?</p> 
 
    </div> 
 

 
    <div> 
 
     <button id="submit">Submit Answers test</button> 
 
    </div> 
 
    <br /> 
 

 
    <!--End of main container --> 
 
    </div> 
 

 
    <!--Test for adding a footer via javascript --> 
 
    <div id="footer"> 
 
    HTML test, will be replaced (footer) 
 
    </div> 
 

 

 
    <script src="assets/javascript/app.js" type="text/javascript"></script> 
 
</body> 
 

 
</html>

+0

Könnten Sie eine Template-Bibliothek verwenden, anstatt sie von Hand zu erzeugen? Schnurrbart zum Beispiel. – giubueno

+0

der prof nie sagte, wir könnten nicht, aber ich glaube nicht, dass das der Zweck der Aufgabe ist –

+0

Werden Sie diese Fragen eins nach dem anderen erzeugen? –

Antwort

0

Sieht aus wie Sie einige Funktionsaufrufe sind vermisst und nicht die richtige Variable aufrufen.

versuchen Sie dies:

//end screen counters 
var incorrectCounter = 0; 
var correctCounter = 0; 
var notAnsweredCounter = 0; 
var quiz = $('#quiz'); 
var index = 0; 

//empty array to push each selected answer to 
var userGuess = []; 
var answerKey = ["html", "css", "jquery", "none of the above"]; 


//function that runs the questions and possible choices at start up 
$(window).ready(function startUp() { 

    //all questions and choices are in a large array 
    var questionArray = [{ 
    questions: "what did we learn in week 1?", 
    //smaller array within the large array for each possible answer for each question 
    choices: ["html", "css", "jquery", "javascript", "none of the above"] 
    }, { 
    questions: "what did we learn in week 2?", 
    choices: ["html", "css", "jquery", "javascript", "none of the above"] 
    }, { 
    questions: "what did we learn in week 4?", 
    choices: ["html", "css", "jquery", "javascript", "none of the above"] 
    }, { 
    questions: "what did we learn in week 5?", 
    choices: ["html", "css", "jquery", "javascript", "none of the above"] 
    }]; 

    function createQuestions() { 
    var trivia = $('<div>', { 
     id: 'question' 
    }); 

    var header = $('<h2>Question ' + (index + 1) + ':</h2>'); 
    trivia.append(header); 

    var question = $('<p>').text(questionArray[index].questions); 
    trivia.append(question); 

    var radioButtons = createChoices(index); 
    trivia.append(radioButtons); 

    quiz.append(trivia); 
    } 

    function createChoices(index) { 
    var radioList = $("<ul>"); 
    var item; 
    var input = ""; 
    for (i = 0; i < questionArray[index].choices.length; i++) { 
     item = $('<li>'); 
     input = '<input type="radio" name="answer" value=' + i + ' />'; 
     input += questionArray[index].choices[i]; 
     item.append(input); 
     radioList.append(item); 
    } 
    return radioList; 
    } 

    createQuestions(); 

    //End of the start up function 
}); 
Verwandte Themen