Question

嗯，我不确定我是否正确地格式化了标题，我会尝试更好地解释自己。

我希望我网站的用户能够使用HTML表单创建投票。民意调查包含多个问题，每个问题都包含“问题（字符串）”和一些答案替代方案。因此产生以下形式的结构：

Question 1
    QuestionString 1
    Alternative 1
    Alternative 2
    Alternative n

Question 2
    QuestionString 2
    Alternative 1
    Alternative 2
    Alternative n

Question N
    QuestionString n
    Alternative 1
    Alternative 2
    Alternative n

我能够动态地将问题的替代输入字段添加到表单中，以及整个问题。

问题是，我想以下列方式评估表格：

for i = 0; i < questions
    //Store question[i].QuestionString in my database
    for j = 0 j < questions[i].alternatives
        // Store questions[i].alternatives[j] in my database

所以基本上我想拥有一系列问题对象，我会说。是否有可能做到这一点？

Answer 1

使用多个答案回答多个问题

您可以依赖HTML表单来组织多维数据数组，如下所示：

<form>
  <h2>Question 0</h2>
  <input type="radio" name="answers[0][]" value="0"> answer 0<br>
  <input type="radio" name="answers[0][]" value="1"> answer 1<br>
  <input type="radio" name="answers[0][]" value="2"> answer 2
  <h2>Question 1</h2>
  <input type="radio" name="answers[1][]" value="0"> answer 0<br>
  <input type="radio" name="answers[1][]" value="1"> answer 1<br>
  <input type="radio" name="answers[1][]" value="2"> answer 2
  <h2>Question 2</h2>
  <input type="checkbox" name="answers[2][]" value="0"> answer 0<br>
  <input type="checkbox" name="answers[2][]" value="1"> answer 1<br>
  <input type="checkbox" name="answers[2][]" value="2"> answer 2
  <h2>Question 3</h2>
  <input type="checkbox" name="answers[3][]" value="0"> answer 0<br>
  <input type="checkbox" name="answers[3][]" value="1"> answer 1<br>
  <input type="checkbox" name="answers[3][]" value="2"> answer 2
</form>

提交此表单后，PHP会在$_REQUEST['answers']中看到一系列问题，每个问题都包含一系列答案，例如$_REQUEST['answers'][0][0]。

如果未选择任何答案，则提交的数组中将缺少这些答案。对于复选框和单选按钮，仅发送选中的选项。对于前2个问题中的每一个，您将有0-1可能检查的无线电，并且对于最后2个问题中的每一个，您将检查0-3可能的复选框

您的PHP脚本应在第一维中查找数组键，以识别问题编号（1和name="answers[1][]"中的$_REQUEST['answers'][1]）和第二维中的数组值（{{ 1}}在1和value="1"）

用单个答案回答多个问题

如果答案总是单选，它们将始终是单选按钮，而不是复选框，因此您可以这样做：

$_REQUEST['answers'][0][0] == 1

如果未选择答案，则始终只有一个<form> <h2>Question 0</h2> <input type="radio" name="answers[0]" value="0"> answer 0<br> <input type="radio" name="answers[0]" value="1"> answer 1<br> <input type="radio" name="answers[0]" value="2"> answer 2 <h2>Question 1</h2> <input type="radio" name="answers[1]" value="0"> answer 0<br> <input type="radio" name="answers[1]" value="1"> answer 1<br> <input type="radio" name="answers[1]" value="2"> answer 2 <h2>Question 2</h2> <input type="radio" name="answers[2]" value="0"> answer 0<br> <input type="radio" name="answers[2]" value="1"> answer 1<br> <input type="radio" name="answers[2]" value="2"> answer 2 <h2>Question 3</h2> <input type="radio" name="answers[3]" value="0"> answer 0<br> <input type="radio" name="answers[3]" value="1"> answer 1<br> <input type="radio" name="answers[3]" value="2"> answer 2 </form>或根本没有answers[0]。必须指定索引才能将单选按钮组合在一起（单击一个应取消选中该组中的所有其他选项）。这仅用于显示问题和收集答案。

定义开始民意调查的问题和答案

为了在投票开始时创建问题，我建议在将每个新问题输入及其答案插入到<div>之前将其包装到DOM中，然后您可以插入尽可能多的[type="text"]个输入你喜欢那个<div>。在表单提交之前，您可以循环遍历<div>以使用循环索引作为问题索引修改[name]属性，但将答案索引留空（自动）

HTML：

<form>
  <div class="question">
    <input type="text" class="question" value="Question 0">
    <input type="text" class="answer" value="answer0">
    <input type="text" class="answer" value="answer1">
    <input type="text" class="answer" value="answer2">
  </div>
  <div class="question">
    <input type="text" class="question" value="Question 1">
    <input type="text" class="answer" value="answer0">
    <input type="text" class="answer" value="answer1">
    <input type="text" class="answer" value="answer2">
  </div>
</form>

jQuery的：

$(document).on('submit', 'form', function(){
  $(this).find('div.question').each(function(i,ele){
    $(ele).find('input.question').attr('name', 'questions['+i+']');
    $(ele).find('input.answer').attr('name', 'answers['+i+'][]');
  });
});

普通JavaScript：

var questions = document.querySelectorAll("div.question");
for(var i = 0; i < questions.length; i++){
  questions[i].querySelector('input.question').name = 'questions['+i+']';
  var answers = questions[i].querySelectorAll('input.answer');
  for(var a = 0; a < answers.length; a++){
    answers[a].name = 'answers['+i+'][]';
  }

}

我还没有尝试过那些jQuery和JavaScript代码段，但我认为他们应该工作

Answer 2

你可以尝试这样的事情。我已经使用Array.push（）帮助编辑问题的顺序，但是开始你应该是好的：

function Question(text, answers){
  this.text = text;
  this.answers = answers;
}
var Questions = [];
Questions.push(new Question('How many fingers?', [8,10,11]));
Questions.push(new Question('How many eyes?', [1,2,3]));
Questions.push(new Question('Why is the sky blue?', ['Because angels have blue skin', "Because of chemicals sprayed by the government", "Because of the way light refracts into different colours"]));
console.log(Questions[2].text);
console.log(Questions[2].answers[2]);

请按照此文档了解有关在JavaScript中循环一系列整数的更多信息（您似乎已经理解了逻辑）https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for

包含多个“对象”的HTML表单

2 个答案:

使用多个答案回答多个问题

用单个答案回答多个问题

定义开始民意调查的问题和答案