使用表格填充数组

时间:2018-07-07 21:41:10

标签: javascript arrays variables

我正在尝试制作一个表单,该表单应按所问问题确定的顺序创建一个数组。我正在尝试使用js,但是却很难,没有经验。它不起作用并不令我感到惊讶。不知何故变量没有值。我已经做过的事情很可能是愚蠢的,我认为可以将其简化一些;-)。希望有人看看我的代码,并帮助我解决这个问题。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="nl" lang="nl">
 <head>
  <title>Keuze studievereniging</title>
  <style>
    fieldset {max-width:500px;}
    button {margin-top:30px;}
  </style>
</head>
  <body>
<h2>Sororities hulp</h2>

<p>Beantwoord onderstaande vragen om te zien welke vereniging het best bij je past.</p>

<form name="formulier"
onsubmit="return validateForm()" method="post">
  <fieldset>
  <legend>Maak je keuze per vraag, vul alle onderdelen in.</legend>
  <div>
<p>Do you believe it is important that faith is emphasized in a sorority?</p>
  <input type="radio" id="vr1_1" name="VR1" value=1> Ja
  <input type="radio" id="vr1_0" name="VR1" value=0> Nee
<p>Would you participate in a hazing?</p>
  <input type="radio" id="vr2_1" name="VR2" value=1> Ja
  <input type="radio" id="vr2_0" name="VR2" value=0> Nee
<p>Would you like to fully integrate within the community of the sorority?</p>
  <input type="radio" id="vr3_1" name="VR3" value=1> Ja
  <input type="radio" id="vr3_0" name="VR3" value=0> Nee
<p>Do you like to party?</p>
  <input type="radio" id="vr4_1" name="VR4" value=1> Ja
  <input type="radio" id="vr4_0" name="VR4" value=0> Nee
<p>Would you sacrifice a free night of your own for the good of the sorority?</p>
  <input type="radio" id="vr5_1" name="VR5" value=1> Ja
  <input type="radio" id="vr5_0" name="VR5" value=0> Nee
<p>Would you like your sorority to be apart of a bigger european system?</p>
  <input type="radio" id="vr6_1" name="VR6" value=1> Ja
  <input type="radio" id="vr6_0" name="VR6" value=0> Nee
<p>Would you enjoy a weekly or by weekly bible study?</p>
  <input type="radio" id="vr7_1" name="VR7" value=1> Ja
  <input type="radio" id="vr7_0" name="VR7" value=0> Nee <br>
<button type="submit">Adviseer mij</button>
  </div>
</fieldset>
</form>

<p>De voor jou geschikste volgorde om te kijken is: </p>

<p id="uitslag"></p>

  <script type="text/javascript">

  function validateForm() {
  var x = document.forms["formulier"]["VR1", "VR2", "VR3", "VR4", "VR5", "VR6", "VR7"].value;
  if (x == "") {
      alert("You have to answer each question for a good advice");
      return false;
  }
}

    var vvr11 = document.getElementsByName(vr1_1);
    console.log (vvr11);
    var vvr10 = document.getElementsByName(vr1_0);
    var vvr21 = document.getElementsByName(vr2_1);
    var vvr20 = document.getElementsByName(vr2_0);
    var vvr31 = document.getElementsByName(vr3_1);
    var vvr30 = document.getElementsByName(vr3_0);
    var vvr41 = document.getElementsByName(vr4_1);
    var vvr40 = document.getElementsByName(vr4_0);
    var vvr51 = document.getElementsByName(vr5_1);
    var vvr50 = document.getElementsByName(vr5_0);
    var vvr61 = document.getElementsByName(vr6_1);
    var vvr60 = document.getElementsByName(vr6_0);
    var vvr71 = document.getElementsByName(vr7_1);
    var vvr70 = document.getElementsByName(vr7_0);

    var alpha = vvr11 + vvr31 + vvr41;
    console.log (alpha);
    var rsk = vvr11 + vvr51 + vvr71;
    var vgste = vvr11 + vvr51 + vvr71;
    var nse = vvr11 + vvr51 + vvr71;
    var audentis = vvr21 + vvr41 + vvr51;
    var taste = vvr21 + vvr31 + vvr41;
    var aegee = vvr31 + vvr41 + vvr61;

    var sororities = [alpha, rsk, vgste, nse, audentis, taste, aegee];

    function sortering() {
        sororities.sort(function(a, b){return a - b});
        document.getElementById("uitslag").innerHTML = sororities;
    }
    sortering ();
   </script>

  </body>
 </html>

1 个答案:

答案 0 :(得分:0)

是的,您的代码有很大的改进潜力,但是我将把这一部分留给您。

您正在使用

document.getElementsByName(vr1_1);

您实际要使用的时间

document.getElementsByName('VR1');

为您提供所有名称为VR1或使用的元素的NodeList

document.getElementById('vr1_1').checked;

明确获取特定元素(此处为vr1_1)以检查其选中状态。