2013-09-10 2 views
0

Здравствуйте, я изо всех сил стараюсь найти лучший подход к простому онлайн-опросу, который отправит результаты поиска в указанное электронное письмо. Я довольно новичок в Javascript, и если кто-то может указать мне в правильном направлении, я бы очень признателен.Отчеты о результатах онлайн-теста

JS Fiddle Link

var allQuestions = [{question: "2 + 2", choices: ["4", "8", "10", "2"],  correctAnswer:0}, 
{question: "6 + 3", choices: ["7", "3", "5", "9"], correctAnswer:3}, 
{question: "4 + 4", choices: ["8", "7", "2", "9"], 
correctAnswer:0}, 
{question: "5 + 0", choices: ["4", "5", "3", "9"], correctAnswer:1},]; 

//you can access checkbox name through an array 
//match array number to number in allQuestions array 

var questionNum = 0; 
var scoreNum = 0; 
var makeQuestions = ""; 


$(document).ready(function() { 
    makeQuestions = function() { 
     if(questionNum === allQuestions.length){ 
      $("input[value=SUBMIT]").remove(); 
      $("#questions").text(" Done!Please click the button below to submit your results. Your score is" + " " + scoreNum); 
     } 
     else{ 
     $("#questions").text(allQuestions[questionNum].question); 
     for(var i=0; i<allQuestions[questionNum]['choices'].length;i++){ 
      $('#words').append('<input type="radio" name="buttons">' + allQuestions[questionNum]['choices'][i] + '</input'); 
     } 
     } 
    } 
    makeQuestions(); 

}); 



var checkQuestions = function() { 
    var lenG = document.getElementsByName("buttons").length; 
    console.log(lenG); 
    var rightAnswer = allQuestions[questionNum]['correctAnswer']; 
    for (var i=0; i<lenG; i++){ 
     if (document.getElementsByName("buttons")[i].checked === true) { 
      console.log(i); 
      console.log(document.getElementsByName("buttons")[i].checked); 
      //compare value to what was inputted 
      if(i === rightAnswer){ 
       scoreNum +=1; 
       alert("Correct! Your score is" +" " + scoreNum); 
      } 
      else{ 
       alert("False! Your score is still"+ " " + scoreNum); 
      } 
     } 

} 
questionNum = questionNum +1; 
$("#words").empty(); 
makeQuestions(); 

} 
+2

В чем конкретная проблема с этим кодом? (Какая ошибка или непредвиденное поведение происходят?) –

+0

Нет Ошибка, я просто прошу немного узнать, как заставить ее сообщать о результатах «викторины», чтобы указать указанное электронное письмо. – user2756478

ответ

0

Вы будете хотеть использовать серверный язык, как PHP по почте счет для вас. Вы также должны подумать о том, как привязать к каждому представлению какой-то идентификатор пользователя (например, имя), иначе вы просто получите вложенный почтовый ящик с множеством баллов без возможности связать их с викторином.

Я обновил ваш jsfiddle, чтобы дать вам общее представление о том, что делать. Я поместил содержимое «submit.php» в поле CSS. В случае, если это не решает должным образом или что-то, вот она снова:

<?php 
$answers_correct = (ctype_digit($_POST['answers_correct']) ? $_POST['answers_correct'] : 'spoofed'); 

$to  = '[email protected]'; 
$subject = 'the subject'; 
$message = 'Answers correct: ' . $answers_correct; 
$headers = 'From: [email protected]' . "\r\n" . 
    'Reply-To: [email protected]' . "\r\n" . 
    'X-Mailer: PHP/' . phpversion(); 

mail($to, $subject, $message, $headers); 
?> 

Thank you for submitting your results! 

Изменения в вашем HTML:

<body> 
<div id="questions"></div> 
<div id="words"></div> 

<input type="button" value="SUBMIT" onClick="checkQuestions()" /> 

<div style="display:none;"> 
    <form id="answer_submission_form" action="submit.php" method="POST"> 
     <input type="hidden" id="answers_correct" name="answers_correct"> 
    </form> 
</div> 

</body> 

и изменения в ваших JS, все внутри $(document).ready(){...:

$(document).ready(function() { 
    makeQuestions = function() { 
     if(questionNum === allQuestions.length){ 
      $("input[value=SUBMIT]").remove(); 
      $("#questions").text(" Done!Please click the button below to submit your results. Your score is" + " " + scoreNum); 
      $("#questions").append("<br><input type='button' id='submit_answers' value='SUBMIT'>"); 
      $("#answers_correct").val(scoreNum); 
     } 
     else{ 
      $("#questions").text(allQuestions[questionNum].question); 
      for(var i=0; i<allQuestions[questionNum]['choices'].length;i++){ 
       $('#words').append('<input type="radio" name="buttons">' + allQuestions[questionNum]['choices'][i] + '</input'); 
      } 
     } 
    } 
    makeQuestions(); 


    $('#submit_answers').on('click', function() { 
     $('#answer_submission_form').submit(); 
    }); 

}); 

И если вы действительно не хотите использовать такой язык, как PHP, который я не рекомендую, вы можете изучить настройку form with a mailto action:

+1

Спасибо, миллион! Это именно тот совет, который я искал. Спасибо за то, что он даже строит скрипку, видя это передо мной, помогает мне тонну. – user2756478

+0

Без проблем, рад, что это помогло! –

Смежные вопросы