- 締切済み
JavaScriptで占いページを作成
JavaScriptで占いページを作成しようと思っています。 探した結果、下記サイトが一番合っていたのですが、pointの所でつまずいてしまいました。 どうかお力をお貸しください。 http://jsfiddle.net/XwfzW/ ボタンを押す度にポイントが加算されるのですが、1クリックで100ポイント。2クリックめで100+(100+5)の205ポイントになってしまいます。 この結果(2クリック目)で100+5の105にするにはどうすれば良いでしょうか?(3クリック目では100+5+4の109が正解です) 宜しくお願いいたします。 HTML <span id="question"></span><br><br> <span id="optionA"></span><input type="button" value="選択" id="optionAButton"> <span id="optionB"></span><input type="button" value="選択" id="optionBButton"><br><br> <span id="point"></span>ポイント JavaScript -var questions = { '1': { text: '問1:山と海、どちらが好き?', options: [ {text: '山', point: 100, next: '2a'}, {text: '海', point: 50, next: '2b'} ] }, '2b': { text: '問2b:ガンガン泳ぐ派?ビーチでまったり派?', options: [ {text: '泳ぐ', point: 5, next: '2a'}, {text: 'まったり', point: 7, next: '1'} ] }, '2a': { text: '問2a:○○○○?', options: [ {text: '△△△', point: 4, next: '1'}, {text: '□□□', point: 2, next: '2b'} ] } } var point = 0; function setQuestion(questionId) { var question = questions[questionId]; $('#question').text(question.text); $('#point').text(point); var optionA = question.options[0]; $('#optionA').text(optionA.text); $('#optionAButton').click(function() { point += optionA.point; setQuestion(optionA.next); }); var optionB = question.options[1]; $('#optionB').text(optionB.text); $('#optionBButton').click(function() { point += optionB.point; setQuestion(optionB.next); }); } $(function() { setQuestion('1'); })
- みんなの回答 (1)
- 専門家の回答
みんなの回答
- nekomikekamo
- ベストアンサー率73% (71/97)
イベント登録が重複しています。 クリックイベント登録は1度で。 var point = 0; var question; function setQuestion(questionId) { question = questions[questionId]; $('#question').text(question.text); $('#point').text(point); $('#optionA').text(question.options[0].text); $('#optionB').text(question.options[1].text); } $(function() { setQuestion('1'); $('#optionAButton').click(function() { point += question.options[0].point; setQuestion(question.options[0].next); }); $('#optionBButton').click(function() { point += question.options[1].point; setQuestion(question.options[1].next); }); })
お礼
完璧なご回答ありがとうございます。 3日間悩んでいたのですが、どんどん行が増えていき八方ふさがりでした。 ありがとうございました。