jQuery Simple Quiz не работает

Question

jQuery Simple Quiz не работает

0

Я просто изучаю Javascript и jQuery. Я сделал простую викторину, которая по существу сломана, но я сузил проблему до моего кода. Я уверен, что все идентификаторы связаны, и что jQuery правильно подключен к CDN. Я знаю, что я мог задавать вопросы один за другим, но это небрежное кодирование.

С http://pastebin.com/54JQwhAg

HTML: <!DOCTYPE html>
<html>
    <head>
        <meta charset="Utf-8">
        <title>The quiz to end all quizes</title>
        <link rel="stylesheet" href="style.css">
        <script src="libs/jquery-1.11.0.min.js"></script>
        <script src="script.js"></script>
        <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
        <link rel="icon" href="favicon.ico" type="image/x-icon">
    </head>
    <body>
        <div id="main">
            <div id="header">
                <img src="images/logo.png">
                <h2>This page is an experiment to see if I can use JavaScript and jQuery to make a quiz game.</h2>
                <p>Please answer with no punctuation.</p>
                <p id="show">Click here to show answers.</p>
                <img id="start" src="images/clickme.png">
            </div>
            <div id="answers">
                <!-- CHEATER!!! -->
                <p><span id="ans1"></span>Q: Who was the first African-American major league baseball player? A: Jackie Robinson</p>
                <p><span id="ans2"></span>Q: Who was the second U.S. President? A: John Adams</p>
                <p><span id="ans3"></span>Q: Where did the general keep his armies? A: In his sleevies</p>
                <p><span id="ans4"></span>Q: Why did the chicken cross the road? A: To get to the other side</p>
                <p><span id="ans5"></span>Q: Why did the scarecrow get a promotion? A: He was outstanding in his field</p>
                <h2 id="numright"></h2>
                <p id="hide">Click here to hide answers.</p>
            </div>
        </div>
    </body>
</html>

Javascript:
$(document).ready(function() {
    var score;
    var questions = [
                    "Who was the first African-American major league baseball player?", 
                    "Who was the second U.S. President?",
                    "Where did the general keep his armies?",
                    "Why did the chicken cross the road?",
                    "Why did the scarecrow get a promotion?"
                    ];
    var answers = [
                    "jackie robinson",
                    "john adams",
                    "in his sleevies",
                    "to get to the other side",
                    "He was outstanding in his field"
                    ];
    $('#answers').hide() // hide answers
    $('#start').click(function() {
        for (num=0; num<5, num++){
            var ans = prompt(questions[num], "Enter Answer Here")
            if (ans == answers[num])
                score++
            } // end if
        } // end for
        $('#answers').show() // show answers
        $('#show').hide() // hide show
        $('#numright').write('You got ' + score + '/5')
    }); // end click
    $("#show").click(function() {
        $('#answers').show() // show answers
        $('#show').hide() // hide show button
    }); // end click
    $("#hide").click(function() {
        $('#answers').hide() // hide answers
        $('#show').show() // show show button
    }); // end click    
}); // end ready

В основном, части, которые должны быть скрыты, не загружаются при запуске, а когда щелкнут изображение, запускающее викторину, ничего не происходит. Когда я попытался сузить проблему до строки кода, части кода случайным образом работают, а затем не работают, без видимой корреляции.

HipsterLeprechaun 15 апр. 2014, в 00:31

Источник

1

Чтобы добавить код, нажмите кнопку {} на панели инструментов и вставьте свой код. Я исправил это выше.
AstroCB 14 апр. 2014, в 22:00
0

Из интереса, поскольку ошибки были связаны с отсутствующими символами, какой текстовый редактор вы используете? Тот, у кого есть подсказки кода, вероятно, будет полезен, чтобы избежать таких ошибок в будущем
Chris Brown 14 апр. 2014, в 22:06
0

Стандартный Блокнот ++
HipsterLeprechaun 15 апр. 2014, в 23:48

Показать ещё 1 комментарий

Теги:

javascript

jquery

html

1 ответ

Ещё вопросы

Чтобы добавить код, нажмите кнопку {} на панели инструментов и вставьте свой код. Я исправил это выше.
Из интереса, поскольку ошибки были связаны с отсутствующими символами, какой текстовый редактор вы используете? Тот, у кого есть подсказки кода, вероятно, будет полезен, чтобы избежать таких ошибок в будущем

Chris Brown · Accepted Answer · 2014-04-14T19-18-00.000Z

Я обнаружил 2 ошибки, проходящих через код, как внутри цикла for

Во-первых, для цикла for вместо запятой после num<5 была запятая вместо запятой

Во-вторых, вам не хватало вашей фигурной фигурной фигуры в выражении if

Исправленный:

for (num=0; num<5; num++) {
    var ans = prompt(questions[num], "Enter Answer Here")
    if (ans == answers[num]) {
        score++
    } // end if
} // end for

Кроме того, есть еще несколько замечаний

Прежде чем пытаться увеличивать переменную score вам необходимо инициализировать его;

var score = 0;

И далее, при выводе оценки в <h2> вы используете .write() как функцию, я предполагаю на основе JavaScript document.write(). В jQuery вместо этого используется .text() и результат результата успешно завершается.

Исправлена скрипка