>
<div id="tab_2_contents" class="tab_contents">
<div class="table-responsive">
<font style="font-size:large">
<table class="table table-responsive table-striped">
<thead>
1.The instructor set out the course objectives at the begining
</thead>
<tbody>
<tr>
<td>
<label class="label label-success">
<input type="radio" id="radio" value="Poor" name="radio" style="width:20px" checked/>
<span class="lbl padding-8">Poor</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio" value="Fair" name="radio" style="width:20px" />
<span class="lbl padding-8">Fair</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio" value="Average" name="radio" style="width:20px" />
<span class="lbl padding-8">Average</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio" value="Good" name="radio" style="width:20px" />
<span class="lbl padding-8">Good</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio" value="VeryGood" name="radio" style="width:20px" />
<span class="lbl padding-8">VeryGood</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio" value="Excellent" name="radio" style="width:20px" />
<span class="lbl padding-8">Excellent</span>
</label>
</td>
</tr>
</tbody>
</table>
<table class="table table-responsive table-striped">
<thead>
2.The instructor communicated his/her ideas clearly
</thead>
<tbody>
<tr>
<td>
<label class="label label-success">
<input type="radio" id="radio1" value="Poor" name="radio" style="width:20px" />
<span class="lbl padding-8">Poor</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio1" value="Fair" name="radio" style="width:20px" />
<span class="lbl padding-8">Fair</span>
</label>
</td>
<td>
 <label class="label label-success">
<input type="radio" id="radio1" value="Average" name="radio" style="width:20px" />
<span class="lbl padding-8">Average</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio1" value="Good" name="radio" style="width:20px" />
<span class="lbl padding-8">Good</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio1" value="VeryGood" name="radio" style="width:20px" />
<span class="lbl padding-8">VeryGood</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio1" value="Excellent" name="radio" style="width:20px" />
<span class="lbl padding-8">Excellent</span>
</label>
</td>
</tr>
</tbody>
</table>
<table class="table table-responsive table-striped">
<thead>
3.He/She encourages discussion during the lecture
</thead>
<tbody>
<tr>
<td>
<label class="label label-success">
<input type="radio" id="radio2" value="Poor" name="radio" style="width:20px" />
<span class="lbl padding-8">Poor</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio2" value="Fair" name="radio" style="width:20px" />
<span class="lbl padding-8">Fair</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio2" value="Average" name="radio" style="width:20px" />
<span class="lbl padding-8">Average</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio2" value="Good" name="radio" style="width:20px" />
<span class="lbl padding-8">Good</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio2" value="VeryGood" name="radio" style="width:20px" />
<span class="lbl padding-8">VeryGood</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio2" value="Excellent" name="radio" style="width:20px" />
<span class="lbl padding-8">Excellent</span>
</label>
</td>
</tr>
</tbody>
</table>
<table class="table table-responsive table-striped">
<thead>
4.He/She competently answered participant's questions
</thead>
<tbody>
<tr>
<td>
<label class="label label-success">
<input type="radio" id="radio3" value="Poor" name="radio" style="width:20px" />
<span class="lbl padding-8">Poor</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio3" value="Fair" name="radio" style="width:20px" />
<span class="lbl padding-8">Fair</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio3" value="Average" name="radio" style="width:20px" />
<span class="lbl padding-8">Average</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio3" value="Good" name="radio" style="width:20px" />
<span class="lbl padding-8">Good</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio3" value="VeryGood" name="radio" style="width:20px" />
<span class="lbl padding-8">VeryGood</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio3" value="Excellent" name="radio" style="width:20px" />
<span class="lbl padding-8">Excellent</span>
</label>
</td>
</tr>
</tbody>
</table>
<table class="table table-responsive table-striped">
<thead class="header">
5.Overall rating of the instructor
</thead>
<tbody>
<tr>
<td>
<label class="label label-success">
<input type="radio" id="radio4" value="Poor" name="radio" style="width:20px" />
<span class="lbl padding-8">Poor</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio4" value="Fair" name="radio" style="width:20px" />
<span class="lbl padding-8">Fair</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio4" value="Average" name="radio" style="width:20px" />
<span class="lbl padding-8">Average</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio4" value="Good" name="radio" style="width:20px" />
<span class="lbl padding-8">Good</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio4" value="VeryGood" name="radio" style="width:20px" />
<span class="lbl padding-8">VeryGood</span>
</label>
</td>
<td>
<label class="label label-success">
<input type="radio" id="radio4" value="Excellent" name="radio" style="width:20px" />
<span class="lbl padding-8">Excellent</span>
</label>
</td>
</tr>
</tbody>
</table>
<table class="table table-responsive table-striped">
<tbody>
<tr>
<td>
<input type="button" class="btn btn-primary" onclick="javaScript:feedback()" id="feedback" value="Submit"/>
</td>
</tr>
</tbody>
</table>
</font>
</div>
</div>

자바 스크립트입니다.

function feedback(){
var s = document.getElementById('radio').value;
alert(s);
}

지금은 경고를 사용하여 어떤 버튼이 선택되어 있는지 확인하고 있지만 작동하지 않습니다. 누군가가 실수로 나를 도울 수 있습니까? 클릭 버튼을 클릭하면 모든 테이블에서 선택한 버튼을 모두 가져오고 싶습니다. 응용 프로그램에 피드백 페이지를 넣으려고합니다. 각 질문에는 라디오 버튼이 연결되도록 각 질문에 5 가지 옵션이 있습니다.

  • 답변 # 1

    document.querySelector(); 사용

    function feedback(){
    var x =document.querySelector('input[name="radio"]:checked').value;
    alert(x)
    }
    
    

    EXAMPLE

  • 답변 # 2

    이름을 양식의 명명 된 속성으로 사용하여 컬렉션 라디오 버튼을 얻은 다음 컬렉션을 반복하여 확인 된 컬렉션을 찾습니다 (예 :

    function getSelected(radios) {
      for (var i=0, iLen=radios.length; i<iLen; i++) {
        if (radios[i].checked) return radios[i].value;
      }
      return '';
    }
    
    
    <form onclick="this.selectedRadioValue.value = getSelected(this.foo)">
      1<input type="radio" name="foo" value="1">
      2<input type="radio" name="foo" value="2">
      3<input type="radio" name="foo" value="3">
      <br>
      Selected: <input type="text" name="selectedRadioValue">
      <input type="reset">
    </form>
    
    

    쿼리 선택기 인터페이스를 사용하려면 다음을 사용할 수 있습니다.

    function getSelected() {
      var radio = document.querySelector('input[name=foo]:checked');
      return radio? radio.value : '';
    }
    
    

    무선을 선택하지 않으면querySelector가 null을 반환하고 null의 value 속성에 액세스하려고하면 오류가 발생하므로 반환 된 값을 먼저 확인해야합니다.

  • 답변 # 3

    function feedback(){
    var check = document.querySelector('input:radio[name="radio"]:checked').value;
    alert(check);
    }
    
    

관련 자료

  • 이전 아이폰 - 탭바 이미지의 색상?
  • 다음 보안 부팅이 포함 된 CDROM의 Clonezilla