Не удается получить значения радио для отправки

1

Я работаю над созданием формы, которая должна принимать три вопроса в форме и добавлять их. Если конечное значение равно трем, он должен открыть вызов другой функции, называемой toggletab(), когда нажата кнопка отправки. Я попробовал это, говоря, что я передал или ошибочно, в зависимости от значения, но это не сработает. Я плохо разбираюсь в JavaScript, и это действительно сбивает меня с толку. Похоже, что он выполняет каждый вопрос отдельно, а не ждет до конца и вычисляет их все вместе. Я не могу понять, почему это происходит. Я также не уверен, как вызвать другую функцию, которая находится в отдельном файле, если кто-то знает, как это сделать.

Спасибо. Это HTML

<fieldset class="article">

      <legend>Have you had your record expunged before?</legend>
      <input type="radio" name="field1" value="0"  />
      <label>
        Yes
      </label>
      <input type="radio" name="field1" value="1" />
      <label>
        No
      </label>

  </fieldset>

    <fieldset class="article">
      <legend>Do you have any charges pending against you?</legend>
      <input type="radio" name="field2" value="0" onclick="getscores2(this)" />
      <label>
        Yes
      </label>
      <input type="radio" name="field2" value="1" onclick="getscores2(this)" />
      <label>
        No
      </label>
    </fieldset>

 <fieldset>
                <legend>Is your drivers license suspended?</legend>
                 <input type="radio" name="field3" value="0" onclick="getscores3(this)"/>
                <label>
                     Yes
                </label>
                 <input type="radio" name="field3" value="1" onclick="getscores3(this)"/>
                 <label>
                     No
                </label>
            </fieldset>
            <fieldset id="submitbutton" class="article">
  <input type="button" id="submit" value="submit" onclick='answer()' />
</fieldset>


</form>

<p id="totalScore">this is answer </p>

  <button onclick = "toggletab()" id="tabButton"><h3>first results</h3>
 </button>
       <form>
         <div id="first"  >
         <fieldset>
                <label>


  <fieldset class="article">

         <legend>Have you had your record expunged before?</legend>
      <input type="radio" name="field1" value="0"  />
      <label>
        Yes
      </label>
      <input type="radio" name="field1" value="1" />
      <label>
        No
      </label>

  </fieldset>

    <fieldset class="article">
      <legend>Do you have any charges pending against you?</legend>
      <input type="radio" name="field2" value="0" onclick="getscores2(this)" />
      <label>
        Yes
      </label>
      <input type="radio" name="field2" value="1" onclick="getscores2(this)" />
      <label>
        No
      </label>
    </fieldset>

 <fieldset>
                <legend>Is your drivers license suspended?</legend>
                 <input type="radio" name="field3" value="0" 
     onclick="getscores3(this)"/>
                <label>
                     Yes
                </label>
                 <input type="radio" name="field3" value="1" 
     onclick="getscores3(this)"/>
                 <label>
                     No
                </label>
            </fieldset>
            <fieldset id="submitbutton" class="article">
  <input type="button" id="submit" value="submit" onclick='answer()' />
</fieldset>


</form>

     <p id="totalScore">this is answer </p>

   <button onclick = "toggletab()" id="tabButton"><h3>first results</h3>
   </button>
       <form>
         <div id="first"  >
         <fieldset>
                <label>
                <legend>Is your arrest record a:</legend>
                    <input type="radio" name="field4" value="1" 
    onclick="getscores4(this)"/>
                    IC 35-38-9-1
                </label>
                <label>
                    <input type="radio" name="field4" value="2" 
    onclick="getscores4(this)"/>
                    IC 35-38-9-2
                </label>
                 <label>
                    <input type="radio" name="field4" value="3" 
   onclick="getscores4(this)"/>
                     IC 35-38-9-3
                </label>
                 <label>
                    <input type="radio" name="field4" value="4" 
  onclick="getscores4(this)"/>
                     IC 35-38-9-4
                </label>
                 <label>
                    <input type="radio" name="field4" value="5" 
      onclick="getscores4(this)"/>
                     IC 35-38-9-5
                </label>
            </fieldset>

Это JavaScript.

function getscores1(score1) {
var getscores1 = (score1.value);
sendScores(getscores1);
}

function getscores2(score2) {
var getscores2 = (score2.value);
sendScores(getscores2);
}

function getscores3(score3) {
var getscores3 = (score3.value);
sendScores(getscores3);
}
function sendScores(getscores1, getscores2, getscores3){
var total = getscores1 + getscores2 + getscores3;
answer(total);
}

function answer(total) {
if (total == 3) {
document.getElementById('totalScore').innerHTML = "false";
} else{
document.getElementById('totalScore').innerHTML = "pass";
}
}
Теги:
forms
submit
radio

1 ответ

0
Лучший ответ

Переменные, определяемые вашими функциями, не являются глобальными. Их значения исчезают после возвращения функции. Таким образом, ваша функция sendScores фактически не имеет доступа к этим значениям, если вы не передадите их в качестве аргументов. Но в то время как sendScores принимает 3 аргумента, вы отправляете только один (тот, который у вас есть, когда вы вызываете функцию).

Один из вариантов - хранить их как глобальные переменные, но глобальными переменными являются Generally Evil . Кроме того, вы можете получить все значения при нажатии кнопки "Отправить". Вот рабочий пример. Обратите внимание, что это не улавливает случай, когда пользователь не отвечает на один или несколько вопросов. Нажмите кнопку "Run snippet" ниже, чтобы увидеть ее в действии.

Для вашего последнего вопроса вы можете поместить свои js в отдельный файл, а затем поместите в свой html <script src="path/to/your/file/js"></script> чтобы загрузить его.

function answer(total) {
  var score = 0;
  if (document.getElementById('exp_yes').checked) {
    score++;
  }
  if (document.getElementById('chg_yes').checked) {
    score++;
  }
  if (document.getElementById('sus_yes').checked) {
    score++;
  }
  if (score > 0) {
    document.getElementById('totalScore').innerHTML = "false";
  } else {
    document.getElementById('totalScore').innerHTML = "pass";
  }
}
<fieldset class="article">

  <legend>Have you had your record expunged before?</legend>
  <input id=exp_yes type="radio" name="field1" value="0" />
  <label>
        Yes
      </label>
  <input id=exp_no type="radio" name="field1" value="1" />
  <label>
        No
      </label>

</fieldset>

<fieldset class="article">
  <legend>Do you have any charges pending against you?</legend>
  <input id=chg_yes type="radio" name="field2" value="0" />
  <label>
        Yes
      </label>
  <input id=chg_no type="radio" name="field2" value="1" />
  <label>
        No
      </label>
</fieldset>

<fieldset>
  <legend>Is your drivers license suspended?</legend>
  <input id=sus_yes type="radio" name="field3" value="0" />
  <label>
                   Yes
              </label>
  <input id=sus_no type="radio" name="field3" value="1" />
  <label>
                   No
              </label>
</fieldset>
<fieldset id="submitbutton" class="article">
  <input type="button" id="submit" value="submit" onclick='answer()' />
</fieldset>


</form>

<p id="totalScore">this is answer </p>
  • 0
    Здравствуйте, Это было действительно полезно и устранило проблему с отправкой, но правильный ответ приходит только в том случае, если все три - да, или все три - нет. в противном случае он напишет pass. Вы знаете, почему это будет? Спасибо.
  • 0
    @ christiemattern Мне не понятно, о чем ты спрашиваешь. Что вы хотите сделать, если некоторые из них да, а некоторые нет?
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню