單選按鈕'onclick'適用於Chrome和Firefox，但不適用於IE瀏覽器

Question

我們正在努力爲學生開發一個非常簡單的HTML/JavaScript通知工具。它提供了在學生檢查描述他或她的高中GPA和標準化考試分數的單選按鈕後要採取哪些課程的建議。當前版本在Chrome和Firefox中均可正常工作，並在檢查了兩個單選按鈕後顯示其結果。在IE11中，頁面顯示並且用戶可以檢查按鈕，但是在檢查第二個按鈕時沒有響應。我們應該如何獨立於（當前）瀏覽器？

一個精簡版本在下面發佈，包含足夠的代碼來演示基本行爲和問題。

function calc() { 
 

 
     //sets all the variables to blank 
 
     gpa109 = "" 
 
     gpa115 = "" 
 
     note = "" 
 

 
     //The value of the GPA radio button input is set in the GPA variable (first button=1, etc...) 
 
     GPA = document.data.GPA.value 
 

 
     //The value of the ACT radio button input is set in the ACT variable (first button=1, etc...) 
 
     ACT = document.data.ACT.value 
 

 
     //Use if-then statements to assign gpa output values to variables based on GPA and ACT inputs 
 
     //gpa output variables are gpa109, gpa115, gpa109120, etc... 
 
     //the note in the text box at the end is in variable "note" 
 

 
     if (GPA == 1) { 
 
     if (ACT == 1) { 
 
      gpa109 = "0.91" 
 
     } 
 
     } 
 
     if (GPA == 1) { 
 
     if (ACT == 1) { 
 
      gpa115 = "No Data" 
 
     } 
 
     } 
 
     if (GPA == 1) { 
 
     if (ACT == 2) { 
 
      gpa109 = "1.50" 
 
     } 
 
     } 
 
     if (GPA == 1) { 
 
     if (ACT == 2) { 
 
      gpa115 = "No Data" 
 
     } 
 
     } 
 
     if (GPA == 2) { 
 
     if (ACT == 1) { 
 
      gpa109 = "1.68" 
 
     } 
 
     } 
 
     if (GPA == 2) { 
 
     if (ACT == 1) { 
 
      gpa115 = "No Data" 
 
     } 
 
     } 
 
     if (GPA == 2) { 
 
     if (ACT == 2) { 
 
      gpa109 = "1.98" 
 
     } 
 
     } 
 
     if (GPA == 2) { 
 
     if (ACT == 2) { 
 
      gpa115 = "1.27" 
 
     } 
 
     } 
 
     if (GPA == 1) { 
 
     if (ACT == 1) { 
 
      note = "we are worried about you." 
 
     } 
 
     } 
 
     if (GPA == 1) { 
 
     if (ACT == 2) { 
 
      note = "slacked off a bit in high school, did you not?" 
 
     } 
 
     } 
 
     if (GPA == 2) { 
 
     if (ACT == 1) { 
 
      note = "you are a classic bad standardized test taker." 
 
     } 
 
     } 
 
     if (GPA == 2) { 
 
     if (ACT == 2) { 
 
      note = "you should probably apply to a better college." 
 
     } 
 
     } 
 

 
     //These statements put all the values determined by the if-then statements into the document 
 

 
     document.data.gpa109.value = gpa109 
 
     document.data.gpa115.value = gpa115 
 
     document.data.note.value = note 
 

 
    }

<form name="data"> 
 

 
    <table COLS=4 cellpadding=2 border=1 align=center> 
 

 
    <tr> 
 
     <td COLSPAN="4"> 
 
     <center><b><font size=+2> 
 
    <p> 
 
    Advising Tool 
 
    </p></font></b> 
 
     </center> 
 
     </td> 
 
    </tr> 
 

 
    <tr> 
 

 
     <td COLSPAN="2"> 
 
     <center><font size=+1> 
 
    
 
    <p> 
 
    What was your High School GPA? 
 
    </p> 
 
     </font> 
 
     </center> 
 
     </td> 
 

 
     <td COLSPAN="2"> 
 
     <center><font size=+1> 
 
    <p> 
 
    What was your ACT Math subscore? 
 
    <p> 
 
     </font> 
 
     </center> 
 
     </td> 
 

 
    </tr> 
 

 
    <tr> 
 
     <td COLSPAN="2"> 
 
     <center> 
 
      <font size=+1> 
 
    
 
    <P> 
 
    <input type="radio" name="GPA" value="1" onclick="calc();"> Less than 3.5<br> 
 
    <input type="radio" name="GPA" value="2" onclick="calc();"> 3.5 or greater<br> 
 
     </P></font> 
 
     </center> 
 
     </td> 
 

 
     <td COLSPAN="2"> 
 
     <center><font size=+1> 
 
    <P> 
 
    <input type="radio" name="ACT" value="1" onclick="calc();"> Less than 26<br> 
 
    <input type="radio" name="ACT" value="2" onclick="calc();"> 26 or greater<br> 
 
     </P>  </font> 
 
     </center> 
 
     </td> 
 
    </tr> 
 

 
    <tr> 
 
     <td COLSPAN="4" align="center"> 
 
     <font size=+1> 
 
    <br> 
 
    Over the past 5 years, students with similar high school GPAs and ACT Math<br>scores had the following average GPA in their introductory CHM courses. 
 
    <br> 
 
    <br> 
 
      </font> 
 
     </td> 
 
    </tr> 
 

 
    <tr> 
 
     <td align="right"> 
 
     Classes Taken 
 
     </td> 
 

 
     <td> 
 
     Average GPA 
 
     </td> 
 

 
    </tr> 
 

 
    <tr> 
 
     <td align="right"> 
 
     CHM 109 Only 
 
     </td> 
 

 
     <td> 
 
     <input name="gpa109" size="10" type="text"> 
 
     </td> 
 

 
     <tr> 
 
     <td align="right"> 
 
      CHM 115 Only 
 
     </td> 
 

 
     <td> 
 
      <input type="text" name="gpa115" size="10"> 
 
     </td> 
 

 

 
     <tr> 
 
      <td COLSPAN="4" align="center"> 
 

 
      <textarea rows="2" cols="100" name="note"> 
 
      </textarea> 
 

 
      </td> 
 
     </tr> 
 

 
    </table> 
 
</form>

Answer 1

你的問題是在這裏，document.data.GPA.value，這裏的GPA是對象的數組，所以你需要像這樣訪問

document.data.GPA[0].value; 

值作爲一個側面說明，您發佈的代碼中填充了過時的元素，如center,font，所以我建議您做一個清理，並使用table進行佈局是outda特德，請例如flexbox，這是極好的這

更新

我的意思與閱讀對象的數組的價值在於做這樣的事情

var v = document.querySelectorAll('input[name=GPA]'); 
for(var i = 0; i < v.length; i++){ 
    if(v[i].checked){ 
     GPA = v[i].value; 
    } 
} 

還有document.querySelector

GPA = document.querySelector('input[name=GPA]:checked').value; 

還是經典的form.elements語法

document.data.elements['GPA'].value;