Javascript 不知道如何在用户点击下一页时动态检查单选按钮，所有单选按钮都位于一个页面中 我在一个项目的中间，我正在一个网站上为用户工作。用户可以单击“后退”按钮，转到上一个问题，也可以单击“下一步”按钮，转到下一个问题

所有这些问题都在同一个父div中，分为各自的div。所以它们都在同一页上。我给父div中的每个问题div一个hide和show属性，以便根据用户单击next和back显示相关问题。因此，如果用户单击“下一步”，我将隐藏当前问题div并显示下一个问题div。反之亦然，当用户单击“上一步”按钮时

HTML

7%
在0-5的范围内，0完全不可能，5极有可能：

你向其他人推荐经典电影的可能性有多大


0
也许您可以将当前问题编号添加到元素名称中，以便检查是否选中了特定的单选按钮组

function getCheckedValue( groupName ) {
    var radios = document.getElementsByName( groupName );
    for( i = 0; i < radios.length; i++ ) {
        if( radios[i].checked ) {
            return radios[i].value;
        }
    }
    return false;
}

if ( getCheckedValue( "q" + currentQuestion ) ) {
    // there is a radio button selected, proceed
} else {
    // ask the user to select a radio button
}

函数getCheckedValue（groupName）{
var radios=document.getElementsByName（groupName）；
对于（i=0；i

（如何检查单选按钮是否已选中从此处获取）

希望有帮助
也许您可以将当前问题编号添加到元素名称，以便检查是否选中了特定的单选按钮组

function getCheckedValue( groupName ) {
    var radios = document.getElementsByName( groupName );
    for( i = 0; i < radios.length; i++ ) {
        if( radios[i].checked ) {
            return radios[i].value;
        }
    }
    return false;
}

if ( getCheckedValue( "q" + currentQuestion ) ) {
    // there is a radio button selected, proceed
} else {
    // ask the user to select a radio button
}

函数getCheckedValue（groupName）{
var radios=document.getElementsByName（groupName）；
对于（i=0；i

（如何检查单选按钮是否已选中从此处获取）

希望它有帮助
您可以检查可见的输入，并查看是否有至少1个已检查的

$('.class:visible').find('input[type=radio]:checked').val()

我还没有测试过这个。。但这至少会让你走上正确的道路

我注意到你的html中也有一些错误。我把它弄干净了一点来吧

<div class="question-box">

  <div class="progress-bar">

    <h3 id="percent">7%</h3>

  </div>

  <div id="one" class="question">
    <p>On a scale of 0-5, where 0 is not at all likely and 5 is extremely likely:</p>
    <p>How likely are you to recommend Classic Screenings Cinema to someone else?</p>
    <div class="answer">

      <ul>
        <li>0</li>
        <li>
          <input type="radio" autocomplete="off" name="q0" value="0">
        </li>
      </ul>

      <ul>
        <li>1</li>
        <li>
          <input type="radio" autocomplete="off" name="q0" value="1">
        </li>
      </ul>

      <ul>
        <li>2</li>
        <li>
          <input type="radio" autocomplete="off" name="q0" value="2">
        </li>
      </ul>

      <ul>
        <li>3</li>
        <li>
          <input type="radio" autocomplete="off" name="q0" value="3">
        </li>
      </ul>

      <ul>
        <li>4</li>
        <li>
          <input type="radio" autocomplete="off" name="q0" value="4">
        </li>
      </ul>

      <ul>
        <li>5</li>
        <li>
          <input type="radio" autocomplete="off" name="q0" value="5">
        </li>
      </ul>

    </div>
  </div>

  <div id="two" class="question">
    <p>On a scale of 0-5, where 0 is not enjoyed it at all and 5 is enjoyed it a lot:</p>
    <p>How much did you enjoy the film/event you watched?</p>
    <div class="answer">

      <ul>
        <li>0</li>
        <li>
          <input type="radio" autocomplete="off" name="q1" value="0">
        </li>
      </ul>

      <ul>
        <li>1</li>
        <li>
          <input type="radio" autocomplete="off" name="q1" value="1">
        </li>
      </ul>

      <ul>
        <li>2</li>
        <li>
          <input type="radio" autocomplete="off" name="q1" value="2">
        </li>
      </ul>

      <ul>
        <li>3</li>
        <li>
          <input type="radio" autocomplete="off" name="q1" value="3">
        </li>
      </ul>

      <ul>
        <li>4</li>
        <li>
          <input type="radio" autocomplete="off" name="q1" value="4">
        </li>
      </ul>

      <ul>
        <li>5</li>
        <li>
          <input type="radio" autocomplete="off" name="q1" value="5">
        </li>
      </ul>

    </div>
  </div>

  <div id="three" class="question">
    <p>On a scale of 0-5, where 0 is very unhelpful and 5 is very helpful:</p>
    <p>Overall, how helpful were the Classic Screenings staff?</p>
    <div class="answer">

      <ul>
        <li>0</li>
        <li>
          <input type="radio" autocomplete="off" name="q2" value="0">
        </li>
      </ul>

      <ul>
        <li>1</li>
        <li>
          <input type="radio" autocomplete="off" name="q2" value="1">
        </li>
      </ul>

      <ul>
        <li>2</li>
        <li>
          <input type="radio" autocomplete="off" name="q2" value="2">
        </li>
      </ul>

      <ul>
        <li>3</li>
        <li>
          <input type="radio" autocomplete="off" name="q2" value="3">
        </li>
      </ul>

      <ul>
        <li>4</li>
        <li>
          <input type="radio" autocomplete="off" name="q2" value="4">
        </li>
      </ul>

      <ul>
        <li>5</li>
        <li>
          <input type="radio" autocomplete="off" name="q2" value="5">
        </li>
      </ul>

    </div>
  </div>

  <div id="four" class="question">
    <p>Did you purchase any food / snacks from the cinema?</p>
    <div class="yesOrNo">
      Yes
      <input class="yorn snacks" autocomplete="off" type="radio" name="food" value="yes"> No
      <input class="yorn snacks" autocomplete="off" type="radio" name="food" value="no">
    </div>
    <div id="food-followUp">
      <p>On a scale of 0-5, where 0 is very poor and 5 is excellent:</p>
      <p>What do you rate the quality of the food / snacks?</p>
      <div class="answer">

        <ul>
          <li>0</li>
          <li>
            <input type="radio" autocomplete="off" name="q3" value="0">
          </li>
        </ul>

        <ul>
          <li>1</li>
          <li>
            <input type="radio" autocomplete="off" name="q3" value="1">
          </li>
        </ul>

        <ul>
          <li>2</li>
          <li>
            <input type="radio" autocomplete="off" name="q3" value="2">
          </li>
        </ul>

        <ul>
          <li>3</li>
          <li>
            <input type="radio" autocomplete="off" name="q3" value="3">
          </li>
        </ul>

        <ul>
          <li>4</li>
          <li>
            <input type="radio" autocomplete="off" name="q3" value="4">
          </li>
        </ul>

        <ul>
          <li>5</li>
          <li>
            <input type="radio" autocomplete="off" name="q3" value="5">
          </li>
        </ul>
      </div>
    </div>
  </div>

  <div id="five" class="question">
    <p>Did you visit the toilet facilities during your visit to Clasic Screenins Cinema?</p>
    <div class="yesOrNo">
      Yes
      <input class="yorn facilities" autocomplete="off" type="radio" name="yorn" value="yes"> No
      <input class="yorn facilities" autocomplete="off" type="radio" name="yorn" value="no">
    </div>
    <div id="facilities-followUp">
      <p>On a scale of 0-5, where 0 is extremely dissatisfied and 5 is extremely satisfied, how would you rate the following:?</p>
      <p>Cleanliness of the toilet facilities</p>

      <div class="answer">

        <ul>
          <li>0</li>
          <li>
            <input type="radio" autocomplete="off" name="q4" value="0">
          </li>
        </ul>

        <ul>
          <li>1</li>
          <li>
            <input type="radio" autocomplete="off" name="q4" value="1">
          </li>
        </ul>

        <ul>
          <li>2</li>
          <li>
            <input type="radio" autocomplete="off" name="q4" value="2">
          </li>
        </ul>

        <ul>
          <li>3</li>
          <li>
            <input type="radio" autocomplete="off" name="q4" value="3">
          </li>
        </ul>

        <ul>
          <li>4</li>
          <li>
            <input type="radio" autocomplete="off" name="q4" value="4">
          </li>
        </ul>

        <ul>
          <li>5</li>
          <li>
            <input type="radio" autocomplete="off" name="q4" value="5">
          </li>
        </ul>

      </div>
    </div>


  </div>

  <div id="six" class="question">
    <p>On a scale of 0-5, where 0 is extremely dissatisfied and 5 is extremely satisfied, how would you rate the following:?</p>
    <p>The amount of time it took to purchase your ticket, factoring in any time with queuing?</p>

    <div class="answer">

      <ul>
        <li>0</li>
        <li>
          <input type="radio" autocomplete="off" name="q5" value="0">
        </li>
      </ul>

      <ul>
        <li>1</li>
        <li>
          <input type="radio" autocomplete="off" name="q5" value="1">
        </li>
      </ul>

      <ul>
        <li>2</li>
        <li>
          <input type="radio" autocomplete="off" name="q5" value="2">
        </li>
      </ul>

      <ul>
        <li>3</li>
        <li>
          <input type="radio" autocomplete="off" name="q5" value="3">
        </li>
      </ul>

      <ul>
        <li>4</li>
        <li>
          <input type="radio" autocomplete="off" name="q5" value="4">
        </li>
      </ul>

      <ul>
        <li>5</li>
        <li>
          <input type="radio" autocomplete="off" name="q5" value="5">
        </li>
      </ul>

    </div>
  </div>

  <div id="seven" class="question">
    <p>With regards to entering the cinema screen and taking your allocated seat, please let us know how strong you agree with
      the following statements, with 0 representing strongly disagree and 5 representing strongly agree.</p>
    <p>My allocated seat was in great condition</p>

    <div class="answer">

      <ul>
        <li>0</li>
        <li>
          <input type="radio" autocomplete="off" name="q6" value="0">
        </li>
      </ul>

      <ul>
        <li>1</li>
        <li>
          <input type="radio" autocomplete="off" name="q6" value="1">
        </li>
      </ul>

      <ul>
        <li>2</li>
        <li>
          <input type="radio" autocomplete="off" name="q6" value="2">
        </li>
      </ul>

      <ul>
        <li>3</li>
        <li>
          <input type="radio" autocomplete="off" name="q6" value="3">
        </li>
      </ul>

      <ul>
        <li>4</li>
        <li>
          <input type="radio" autocomplete="off" name="q6" value="4">
        </li>
      </ul>

      <ul>
        <li>5</li>
        <li>
          <input type="radio" autocomplete="off" name="q6" value="5">
        </li>
      </ul>

    </div>

    <p>The area around my seat was clean and tidy</p>

    <div class="answer">

      <ul>
        <li>0</li>
        <li>
          <input type="radio" autocomplete="off" name="q7" value="0">
        </li>
      </ul>

      <ul>
        <li>1</li>
        <li>
          <input type="radio" autocomplete="off" name="q7" value="1">
        </li>
      </ul>

      <ul>
        <li>2</li>
        <li>
          <input type="radio" autocomplete="off" name="q7" value="2">
        </li>
      </ul>

      <ul>
        <li>3</li>
        <li>
          <input type="radio" autocomplete="off" name="q7" value="3">
        </li>
      </ul>

      <ul>
        <li>4</li>
        <li>
          <input type="radio" autocomplete="off" name="q7" value="4">
        </li>
      </ul>

      <ul>
        <li>5</li>
        <li>
          <input type="radio" autocomplete="off" name="q7" value="5">
        </li>
      </ul>

    </div>

  </div>

  <div id="eight" class="question">
    <p>Were there any disruptions that occured during the viewing of you movie / event?</p>
    <div class="yesOrNo">
      Yes
      <input class="yorn" autocomplete="off" type="radio" name="yorn" value="yes"> No
      <input class="yorn" autocomplete="off" type="radio" name="yorn" value="no">
    </div>

    <p class="disrupted">Please tell us more about the disruption and what staff did to handle this</p>
    <textarea></textarea>

  </div>

  <div id="nine" class="question">

    <h2>THANK YOU FOR COMPLETING OUR SURVEY!</h2>

    <p>We are very grateful towards you taking the time out to complete this survery.</p>

    <p>Every couple of months our team reflect on these surverys and we develop straregies on the best ways to deal with areas
      in which can do with improving, as well as ideas on how to further strengthen the positives.</p>

    <p>Once again, we thank you for filling in the survey and we hope to see you soon!</p>

  </div>

</div>

<div class="navigate">

  <div id="backBtn" class="back questionchoice">

    <h2>BACK</h2>

  </div>

  <div id="nextBtn" class="next questionchoice">

    <h2>NEXT</h2>

  </div>

</div>


7%
在0-5的范围内，0完全不可能，5极有可能：

你向其他人推荐经典电影的可能性有多大


0




一,




二,




三,




四,




五,



在0-5的范围内，0一点也不享受，而5则非常享受：

你对你观看的电影/活动有多喜欢


0




一,




二,




三,




四,




五,



在0-5的范围内，0是非常无用的，5是非常有用的：

总的来说，经典电影的工作人员有多大帮助


0




一,




二,




三,




四,




五,



你从电影院买了什么食物/零食吗

对
不
在0-5的范围内，0表示非常差，5表示优秀：

你对食物/零食的质量评价如何


0




一,




二,




三,




四,




五,



在参观Clasic Screenins电影院期间，您参观过厕所设施吗

对
不
在0-5分制中，0表示非常不满意，5表示非常满意，您如何评价以下各项：

厕所设施的清洁


0




一,




二,




三,
<div class="question-box">

  <div class="progress-bar">

    <h3 id="percent">7%</h3>

  </div>

  <div id="one" class="question">
    <p>On a scale of 0-5, where 0 is not at all likely and 5 is extremely likely:</p>
    <p>How likely are you to recommend Classic Screenings Cinema to someone else?</p>
    <div class="answer">

      <ul>
        <li>0</li>
        <li>
          <input type="radio" autocomplete="off" name="q0" value="0">
        </li>
      </ul>

      <ul>
        <li>1</li>
        <li>
          <input type="radio" autocomplete="off" name="q0" value="1">
        </li>
      </ul>

      <ul>
        <li>2</li>
        <li>
          <input type="radio" autocomplete="off" name="q0" value="2">
        </li>
      </ul>

      <ul>
        <li>3</li>
        <li>
          <input type="radio" autocomplete="off" name="q0" value="3">
        </li>
      </ul>

      <ul>
        <li>4</li>
        <li>
          <input type="radio" autocomplete="off" name="q0" value="4">
        </li>
      </ul>

      <ul>
        <li>5</li>
        <li>
          <input type="radio" autocomplete="off" name="q0" value="5">
        </li>
      </ul>

    </div>
  </div>

  <div id="two" class="question">
    <p>On a scale of 0-5, where 0 is not enjoyed it at all and 5 is enjoyed it a lot:</p>
    <p>How much did you enjoy the film/event you watched?</p>
    <div class="answer">

      <ul>
        <li>0</li>
        <li>
          <input type="radio" autocomplete="off" name="q1" value="0">
        </li>
      </ul>

      <ul>
        <li>1</li>
        <li>
          <input type="radio" autocomplete="off" name="q1" value="1">
        </li>
      </ul>

      <ul>
        <li>2</li>
        <li>
          <input type="radio" autocomplete="off" name="q1" value="2">
        </li>
      </ul>

      <ul>
        <li>3</li>
        <li>
          <input type="radio" autocomplete="off" name="q1" value="3">
        </li>
      </ul>

      <ul>
        <li>4</li>
        <li>
          <input type="radio" autocomplete="off" name="q1" value="4">
        </li>
      </ul>

      <ul>
        <li>5</li>
        <li>
          <input type="radio" autocomplete="off" name="q1" value="5">
        </li>
      </ul>

    </div>
  </div>

  <div id="three" class="question">
    <p>On a scale of 0-5, where 0 is very unhelpful and 5 is very helpful:</p>
    <p>Overall, how helpful were the Classic Screenings staff?</p>
    <div class="answer">

      <ul>
        <li>0</li>
        <li>
          <input type="radio" autocomplete="off" name="q2" value="0">
        </li>
      </ul>

      <ul>
        <li>1</li>
        <li>
          <input type="radio" autocomplete="off" name="q2" value="1">
        </li>
      </ul>

      <ul>
        <li>2</li>
        <li>
          <input type="radio" autocomplete="off" name="q2" value="2">
        </li>
      </ul>

      <ul>
        <li>3</li>
        <li>
          <input type="radio" autocomplete="off" name="q2" value="3">
        </li>
      </ul>

      <ul>
        <li>4</li>
        <li>
          <input type="radio" autocomplete="off" name="q2" value="4">
        </li>
      </ul>

      <ul>
        <li>5</li>
        <li>
          <input type="radio" autocomplete="off" name="q2" value="5">
        </li>
      </ul>

    </div>
  </div>

  <div id="four" class="question">
    <p>Did you purchase any food / snacks from the cinema?</p>
    <div class="yesOrNo">
      Yes
      <input class="yorn snacks" autocomplete="off" type="radio" name="food" value="yes"> No
      <input class="yorn snacks" autocomplete="off" type="radio" name="food" value="no">
    </div>
    <div id="food-followUp">
      <p>On a scale of 0-5, where 0 is very poor and 5 is excellent:</p>
      <p>What do you rate the quality of the food / snacks?</p>
      <div class="answer">

        <ul>
          <li>0</li>
          <li>
            <input type="radio" autocomplete="off" name="q3" value="0">
          </li>
        </ul>

        <ul>
          <li>1</li>
          <li>
            <input type="radio" autocomplete="off" name="q3" value="1">
          </li>
        </ul>

        <ul>
          <li>2</li>
          <li>
            <input type="radio" autocomplete="off" name="q3" value="2">
          </li>
        </ul>

        <ul>
          <li>3</li>
          <li>
            <input type="radio" autocomplete="off" name="q3" value="3">
          </li>
        </ul>

        <ul>
          <li>4</li>
          <li>
            <input type="radio" autocomplete="off" name="q3" value="4">
          </li>
        </ul>

        <ul>
          <li>5</li>
          <li>
            <input type="radio" autocomplete="off" name="q3" value="5">
          </li>
        </ul>
      </div>
    </div>
  </div>

  <div id="five" class="question">
    <p>Did you visit the toilet facilities during your visit to Clasic Screenins Cinema?</p>
    <div class="yesOrNo">
      Yes
      <input class="yorn facilities" autocomplete="off" type="radio" name="yorn" value="yes"> No
      <input class="yorn facilities" autocomplete="off" type="radio" name="yorn" value="no">
    </div>
    <div id="facilities-followUp">
      <p>On a scale of 0-5, where 0 is extremely dissatisfied and 5 is extremely satisfied, how would you rate the following:?</p>
      <p>Cleanliness of the toilet facilities</p>

      <div class="answer">

        <ul>
          <li>0</li>
          <li>
            <input type="radio" autocomplete="off" name="q4" value="0">
          </li>
        </ul>

        <ul>
          <li>1</li>
          <li>
            <input type="radio" autocomplete="off" name="q4" value="1">
          </li>
        </ul>

        <ul>
          <li>2</li>
          <li>
            <input type="radio" autocomplete="off" name="q4" value="2">
          </li>
        </ul>

        <ul>
          <li>3</li>
          <li>
            <input type="radio" autocomplete="off" name="q4" value="3">
          </li>
        </ul>

        <ul>
          <li>4</li>
          <li>
            <input type="radio" autocomplete="off" name="q4" value="4">
          </li>
        </ul>

        <ul>
          <li>5</li>
          <li>
            <input type="radio" autocomplete="off" name="q4" value="5">
          </li>
        </ul>

      </div>
    </div>


  </div>

  <div id="six" class="question">
    <p>On a scale of 0-5, where 0 is extremely dissatisfied and 5 is extremely satisfied, how would you rate the following:?</p>
    <p>The amount of time it took to purchase your ticket, factoring in any time with queuing?</p>

    <div class="answer">

      <ul>
        <li>0</li>
        <li>
          <input type="radio" autocomplete="off" name="q5" value="0">
        </li>
      </ul>

      <ul>
        <li>1</li>
        <li>
          <input type="radio" autocomplete="off" name="q5" value="1">
        </li>
      </ul>

      <ul>
        <li>2</li>
        <li>
          <input type="radio" autocomplete="off" name="q5" value="2">
        </li>
      </ul>

      <ul>
        <li>3</li>
        <li>
          <input type="radio" autocomplete="off" name="q5" value="3">
        </li>
      </ul>

      <ul>
        <li>4</li>
        <li>
          <input type="radio" autocomplete="off" name="q5" value="4">
        </li>
      </ul>

      <ul>
        <li>5</li>
        <li>
          <input type="radio" autocomplete="off" name="q5" value="5">
        </li>
      </ul>

    </div>
  </div>

  <div id="seven" class="question">
    <p>With regards to entering the cinema screen and taking your allocated seat, please let us know how strong you agree with
      the following statements, with 0 representing strongly disagree and 5 representing strongly agree.</p>
    <p>My allocated seat was in great condition</p>

    <div class="answer">

      <ul>
        <li>0</li>
        <li>
          <input type="radio" autocomplete="off" name="q6" value="0">
        </li>
      </ul>

      <ul>
        <li>1</li>
        <li>
          <input type="radio" autocomplete="off" name="q6" value="1">
        </li>
      </ul>

      <ul>
        <li>2</li>
        <li>
          <input type="radio" autocomplete="off" name="q6" value="2">
        </li>
      </ul>

      <ul>
        <li>3</li>
        <li>
          <input type="radio" autocomplete="off" name="q6" value="3">
        </li>
      </ul>

      <ul>
        <li>4</li>
        <li>
          <input type="radio" autocomplete="off" name="q6" value="4">
        </li>
      </ul>

      <ul>
        <li>5</li>
        <li>
          <input type="radio" autocomplete="off" name="q6" value="5">
        </li>
      </ul>

    </div>

    <p>The area around my seat was clean and tidy</p>

    <div class="answer">

      <ul>
        <li>0</li>
        <li>
          <input type="radio" autocomplete="off" name="q7" value="0">
        </li>
      </ul>

      <ul>
        <li>1</li>
        <li>
          <input type="radio" autocomplete="off" name="q7" value="1">
        </li>
      </ul>

      <ul>
        <li>2</li>
        <li>
          <input type="radio" autocomplete="off" name="q7" value="2">
        </li>
      </ul>

      <ul>
        <li>3</li>
        <li>
          <input type="radio" autocomplete="off" name="q7" value="3">
        </li>
      </ul>

      <ul>
        <li>4</li>
        <li>
          <input type="radio" autocomplete="off" name="q7" value="4">
        </li>
      </ul>

      <ul>
        <li>5</li>
        <li>
          <input type="radio" autocomplete="off" name="q7" value="5">
        </li>
      </ul>

    </div>

  </div>

  <div id="eight" class="question">
    <p>Were there any disruptions that occured during the viewing of you movie / event?</p>
    <div class="yesOrNo">
      Yes
      <input class="yorn" autocomplete="off" type="radio" name="yorn" value="yes"> No
      <input class="yorn" autocomplete="off" type="radio" name="yorn" value="no">
    </div>

    <p class="disrupted">Please tell us more about the disruption and what staff did to handle this</p>
    <textarea></textarea>

  </div>

  <div id="nine" class="question">

    <h2>THANK YOU FOR COMPLETING OUR SURVEY!</h2>

    <p>We are very grateful towards you taking the time out to complete this survery.</p>

    <p>Every couple of months our team reflect on these surverys and we develop straregies on the best ways to deal with areas
      in which can do with improving, as well as ideas on how to further strengthen the positives.</p>

    <p>Once again, we thank you for filling in the survey and we hope to see you soon!</p>

  </div>

</div>

<div class="navigate">

  <div id="backBtn" class="back questionchoice">

    <h2>BACK</h2>

  </div>

  <div id="nextBtn" class="next questionchoice">

    <h2>NEXT</h2>

  </div>

</div>

var checkinput
document.getElementById(questions[currentQuestion]).getElementsByTagName("input");
if (checkinput.value == ""){
}
else{