0

だから私はちょっとしたクイズを作ろうとしていて、彼の選択肢を持つすべての質問を表示したいと思っています。ユーザーが次のボタンをクリックすると、現在の質問が削除され、選択肢のある次の質問が表示されます。そんな感じ：

質問: 何? 選択肢: 1-a、2-b、3-c、4-d

「次へ」ボタン。

次をクリックすると、現在の質問が削除され (選択肢も削除され)、次の質問が表示されます: question: why? 選択肢: 1-z、2-x、3-y、4-r

「次へ」ボタン

ここに私のhtmlコードがあります:

<div class="well span6 offset3">
            <script id="try" type="text/x-handlebars-template">
                <form>
                    <fieldset>
                        <legend>Login</legend>
                        <input id="fn" type="text" name="userF" class="input-block-level" placeholder="First Name">
                        <input id="ln" type="text" name="userL" class="input-block-level" placeholder="Last Name">
                        <input id="login" type="submit" class="btn btn-primary" value="login">
                    </fieldset>
                </form>
                {{#each this}}
                <div><h4>{{question}}</h4></div>
                <ul>
                {{#each choices}}
                <li><input type="radio" name="{{../question}}" value="{{this}}">{{this}}</li>
                {{/each}}
                </ul>
                {{/each}}
                <input type="submit" id="next" class="btn btn-primary" value="Next" placeholder="Next">
            </script>

ここに私の配列があります:

var allQuestions = [
    new QuestionCreate("Which is the Capital of Australia?", ["Syndey", "Canberra", "Melbourne", "Hobart"], 2),
    new QuestionCreate("How much population there is in Australia?", ["22M", "18m", "20M", "23M"], 4),
    new QuestionCreate("How is the most expensive soccer player ever?", ["Cristiano Ronaldo", "Messi", "Zlatan Ibrahimovic", "Luis Figo"], 1),
    new QuestionCreate("Which national team as the most wins in the Fifa World Cup?", ["Italy", "Spain", "Brazil", "England"], 3)
];

これが私のコンパイルです: theTemplateScript = $("#try").html();

var theTemplate = Handlebars.compile(theTemplateScript);

$(".offset3").append(theTemplate(allQuestions));
4

2 に答える 2

1

最初の質問をレンダリングした後、次のようなことができるかもしれません。

var counter = 0 
$("#next").click(function() {
  $(".offset3").html("")
  counter = counter + 1 
  $(".offset3").append(theTemplate(allQuestions[counter]));
});
于 2013-07-27T21:47:44.293 に答える