onclick后，函数没有启动

Question

您好我试着为我的朋友做个测验。我在我的编辑器中设置了功能，当我将它移动到服务器时，按钮被击中后没有任何反应。

我的HTML代码是：

<div align="center"><img src="../obrazki/logo/logo4.jpg" class="logo"/></div>
<form  method="post" name="Formularz">
<strong>1. Question 1</strong><br>
<input  type="radio" name="a" value="5" />a) answer 1<br/>
<input  type="radio" name="a" value="3" />b) answer 2<br/>
<input  type="radio" name="a" value="1" />c) answer 3<br/>
<br/>
 .
 .
 .
<strong>15. Question 15</strong><br> 
<input  type="radio" name="b" value="5" />a) answer 1 <br/>
<input  type="radio" name="b" value="3" />b) answer 2<br/>
<input  type="radio" name="b" value="1" />c) answer 3<br/>
<br/>
</form>
<form method="post" name="formularz2" >
<strong>16. question16</strong><br> 
<input  type="radio" name="p" value="9" />a) answer 1<br/>
<input  type="radio" name="p" value="7" />b) answer 2<br/>
<input  type="radio" name="p" value="5" />c) answer 3<br/>
<input  type="radio" name="p" value="3" />d) answer 4<br/>
<input  type="radio" name="p" value="1" />e) answer 5<br/>
<br/>
.
.
.
<strong>20. Question 20</strong><br> 
<input  type="radio" name="w" value="9" />answer 1<br/>
<input  type="radio" name="w" value="7" />answer 2<br/>
<input  type="radio" name="w" value="5" />answer 3<br/>
<input  type="radio" name="w" value="3" />d) answer 4<br/>
<input  type="radio" name="w" value="1" />e) answer 5<br/>
<br/>
</form>
<button  type="button" onclick="checkRadio()">test</button>
<a  href="../index.htm"><p  align="center">Strona Główna</p></a>
<div id="suma"></div>
<div  id="suma2"></div>

我的脚本如下所示：

<script type="text/javascript">
 function checkRadio() {
alert("hello World");
var form = document.getElementById('Formularz');
var form2 = document.getElementById('Formularz2');
var suma = 0;
var suma2= 0;
for ( var i=0; i<form.elements.length; i++)
if (form.elements[i].checked) {
        suma=suma+parseInt(form.elements[i].value);
        document.getElementById("suma").innerHTML = suma;
}
alert(suma);
for ( var i=0; i<form2.elements.length; i++)
if (form2.elements[i].checked) {
        suma2=suma2+parseInt(form2.elements[i].value);
        document.getElementById("suma2").innerHTML = suma2;
}
alert(suma2);
if (suma<9){
    if (suma2<20) {window.location="spider_bushi.htm"};
    else if (suma2<30) {window.location="spider_courtier.htm"};
    else {window.location="spider_shugenja.htm"}; 
}
 else if (suma<17){
    if (suma2<10) {window.location="scorpion_ninja.htm"};
    else if (suma2<20) {window.location="scorpion_bushi.htm"};
    else if (suma2<30) {window.location="scorpion_courtier.htm"};
    else {window.location="scorpion_shugenja.htm"};
}
else if (suma<26){
        if (suma2<20) {window.location="crab_bushi.htm"};
    else if (suma2<30) {window.location="crab_courtier.htm"};
    else if (suma2<40) {window.location="crab_shugenja.htm"};
    else {window.location="crab_monk.htm"}; 
}
else if (suma<34){
    if (suma2<15) {window.location="mantis_bushi.htm"};
    else if (suma2<30) {window.location="mantis_courtier.htm"};
    else {window.location="mantis_shugenja.htm"}; 
}
else if (suma<42){
    if (suma2<15) {window.location="unicron_bushi.htm"}; 
    else if (suma2<30) {window.location="unicron_courtier.htm"}; 
    else {window.location="unicron_shugenja.htm"}; 
}
else if (suma<51){
    if (suma2<20) {window.location="dragon_bushi.htm"}; 
    else if (suma2<30) {window.location="dragon_courtier.htm"};
    else if (suma2<40) {window.location="dragon_shugenja.htm"};
    else {window.location="dragon_monk.htm"}; 
}
else if (suma<60){
    if (suma2<20) {window.location="phoenix_bushi.htm"}; 
    else if (suma2<30) {window.location="phoenix_courtier.htm"}; 
    else if (suma2<40) {window.location="phoenix_shugenja.htm"}; 
    else {window.location="phoenix_monk.htm"}; 
}
    else if (suma<68){
    if (suma2<16) {window.location="crane_bushi.htm"}; 
    else if (suma2<31) {window.location="crane_courtier.htm"};
    else {window.location="crane_shugenja.htm"}; 
}
    else if (suma<76){
    if (suma2<16) {window.location="lion_bushi.htm"}; 
    else if (suma2<31) {window.location="lion_courtier.htm"};
    else {window.location="lion_shugenja.htm"};
}
else { alert("brak") }
} 
</script>

脚本正在工作，因为在加载页面时只需放置一个“hello World”。但按钮根本没有启动checkRadio功能，它甚至没有进入“hello world”行。 请帮忙。

Answer 1

您的代码中存在少量错误。

首先，您在if-else阻止中不必要地使用;。

if (suma2<20) {window.location="crab_bushi.htm"};
    else if (suma2<30) {window.location="crab_courtier.htm"};
    else if (suma2<40) {window.location="crab_shugenja.htm"};
    else {window.location="crab_monk.htm"}; 

语句var form = document.getElementById（'Formularz'）;是错的。由于没有名为Formularz的表单ID。

我已经纠正了这些错误。

<强> HTML ：

<div align="center"><img src="../obrazki/logo/logo4.jpg" class="logo"/></div>
<form  method="post" name="Formularz" id="Formularz">
<strong>1. Question 1</strong><br>
<input  type="radio" name="a" value="5" />a) answer 1<br/>
<input  type="radio" name="a" value="3" />b) answer 2<br/>
<input  type="radio" name="a" value="1" />c) answer 3<br/>
<br/>
 .
 .
 .
<strong>15. Question 15</strong><br> 
<input  type="radio" name="b" value="5" />a) answer 1 <br/>
<input  type="radio" name="b" value="3" />b) answer 2<br/>
<input  type="radio" name="b" value="1" />c) answer 3<br/>
<br/>
</form>
<form method="post" name="formularz2" id="formularz2" >
<strong>16. question16</strong><br> 
<input  type="radio" name="p" value="9" />a) answer 1<br/>
<input  type="radio" name="p" value="7" />b) answer 2<br/>
<input  type="radio" name="p" value="5" />c) answer 3<br/>
<input  type="radio" name="p" value="3" />d) answer 4<br/>
<input  type="radio" name="p" value="1" />e) answer 5<br/>
<br/>
.
.
.
<strong>20. Question 20</strong><br> 
<input  type="radio" name="w" value="9" />answer 1<br/>
<input  type="radio" name="w" value="7" />answer 2<br/>
<input  type="radio" name="w" value="5" />answer 3<br/>
<input  type="radio" name="w" value="3" />d) answer 4<br/>
<input  type="radio" name="w" value="1" />e) answer 5<br/>
<br/>
</form>
<button  type="button" onclick="checkRadio()">test</button>
<a  href="../index.htm"><p  align="center">Strona Główna</p></a>
<div id="suma"></div>
<div  id="suma2"></div>

<强> JS ：

function checkRadio() {
    alert("hello World");
    var form = document.getElementById('Formularz');
    var form2 = document.getElementById('Formularz2');
    var suma = 0;
    var suma2 = 0;
    for (var i = 0; i < form.elements.length; i++)
    if (form.elements[i].checked) {
        suma = suma + parseInt(form.elements[i].value,10);
        document.getElementById("suma").innerHTML = suma;
    }
    alert(suma);
    for ( i = 0; i < form2.elements.length; i++)
    if (form2.elements[i].checked) {
        suma2 = suma2 + parseInt(form2.elements[i].value,10);
        document.getElementById("suma2").innerHTML = suma2;
    }
    alert(suma2);
    if (suma < 9) {
        if (suma2 < 20) {
            window.location = "spider_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "spider_courtier.htm";
        } else {
            window.location = "spider_shugenja.htm";
        }
    } else if (suma < 17) {
        if (suma2 < 10) {
            window.location = "scorpion_ninja.htm";
        } else if (suma2 < 20) {
            window.location = "scorpion_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "scorpion_courtier.htm";
        } else {
            window.location = "scorpion_shugenja.htm";
        }
    } else if (suma < 26) {
        if (suma2 < 20) {
            window.location = "crab_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "crab_courtier.htm";
        } else if (suma2 < 40) {
            window.location = "crab_shugenja.htm";
        } else {
            window.location = "crab_monk.htm";
        }
    } else if (suma < 34) {
        if (suma2 < 15) {
            window.location = "mantis_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "mantis_courtier.htm";
        } else {
            window.location = "mantis_shugenja.htm";
        }
    } else if (suma < 42) {
        if (suma2 < 15) {
            window.location = "unicron_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "unicron_courtier.htm";
        } else {
            window.location = "unicron_shugenja.htm";
        }
    } else if (suma < 51) {
        if (suma2 < 20) {
            window.location = "dragon_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "dragon_courtier.htm";
        } else if (suma2 < 40) {
            window.location = "dragon_shugenja.htm";
        } else {
            window.location = "dragon_monk.htm";
        }
    } else if (suma < 60) {
        if (suma2 < 20) {
            window.location = "phoenix_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "phoenix_courtier.htm";
        } else if (suma2 < 40) {
            window.location = "phoenix_shugenja.htm";
        } else {
            window.location = "phoenix_monk.htm";
        }
    } else if (suma < 68) {
        if (suma2 < 16) {
            window.location = "crane_bushi.htm";
        } else if (suma2 < 31) {
            window.location = "crane_courtier.htm";
        } else {
            window.location = "crane_shugenja.htm";
        }
    } else if (suma < 76) {
        if (suma2 < 16) {
            window.location = "lion_bushi.htm";
        } else if (suma2 < 31) {
            window.location = "lion_courtier.htm";
        } else {
            window.location = "lion_shugenja.htm";
        }
    } else {
        alert("brak");
    }
}

即使现在代码也无法完美运行（如预期的那样）。原因是您在同一页面中使用两种表单。在堆栈溢出时，在同一页面处理多个表单已有很多答案。

有关JavaScript代码调试的建议：

使用Chrome调试器或Firebug进行逐行JS代码调试。如果开发人员控制台已打开，则执行将中断。它也适用于萤火虫。

<强> Link

此外，您始终可以在 JSFIDDLE 上测试您的JavaScript代码。 JS Fiddle是javascript的最佳在线IDE。它精确定位JS错误，甚至显示错误信息。

Answer 2

尝试下面的脚本你已经放了不需要的分号：

    function checkRadio() {
    alert("hello World");
    var form = document.getElementById('Formularz');
    var form2 = document.getElementById('Formularz2');
    var suma = 0;
    var suma2 = 0;
    for (var i = 0; i < form.elements.length; i++)
        if (form.elements[i].checked) {
            suma = suma + parseInt(form.elements[i].value);
            document.getElementById("suma").innerHTML = suma;
        }
    alert(suma);
    for (var i = 0; i < form2.elements.length; i++)
        if (form2.elements[i].checked) {
            suma2 = suma2 + parseInt(form2.elements[i].value);
            document.getElementById("suma2").innerHTML = suma2;
        }
    alert(suma2);
    if (suma < 9) {
        if (suma2 < 20) {
            window.location = "spider_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "spider_courtier.htm"
        }

    else
        {
            window.location = "spider_shugenja.htm"
        }

    }
    else if (suma < 17) {
        if (suma2 < 10) {
            window.location = "scorpion_ninja.htm"
        }

    else
        if (suma2 < 20) {
            window.location = "scorpion_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "scorpion_courtier.htm"
        }

    else
        {
            window.location = "scorpion_shugenja.htm"
        }

    }
    else if (suma < 26) {
        if (suma2 < 20) {
            window.location = "crab_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "crab_courtier.htm"
        }

    else
        if (suma2 < 40) {
            window.location = "crab_shugenja.htm"
        }

    else
        {
            window.location = "crab_monk.htm"
        }

    }
    else if (suma < 34) {
        if (suma2 < 15) {
            window.location = "mantis_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "mantis_courtier.htm"
        }

    else
        {
            window.location = "mantis_shugenja.htm"
        }

    }
    else if (suma < 42) {
        if (suma2 < 15) {
            window.location = "unicron_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "unicron_courtier.htm"
        }

    else
        {
            window.location = "unicron_shugenja.htm"
        }

    }
    else if (suma < 51) {
        if (suma2 < 20) {
            window.location = "dragon_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "dragon_courtier.htm"
        }

    else
        if (suma2 < 40) {
            window.location = "dragon_shugenja.htm"
        }

    else
        {
            window.location = "dragon_monk.htm"
        }

    }
    else if (suma < 60) {
        if (suma2 < 20) {
            window.location = "phoenix_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "phoenix_courtier.htm"
        }

    else
        if (suma2 < 40) {
            window.location = "phoenix_shugenja.htm"
        }

    else
        {
            window.location = "phoenix_monk.htm"
        }

    }
    else if (suma < 68) {
        if (suma2 < 16) {
            window.location = "crane_bushi.htm"
        }

    else
        if (suma2 < 31) {
            window.location = "crane_courtier.htm"
        }

    else
        {
            window.location = "crane_shugenja.htm"
        }

    }
    else if (suma < 76) {
        if (suma2 < 16) {
            window.location = "lion_bushi.htm"
        }

    else
        if (suma2 < 31) {
            window.location = "lion_courtier.htm"
        }

    else
        {
            window.location = "lion_shugenja.htm"
        }

    }
    else {
        alert("brak")
    }
}

和html代码：

    <div align="center"><img src="../obrazki/logo/logo4.jpg" class="logo"/></div>
<form method="post" name="Formularz" id="Formularz">
    <strong>1. Question 1</strong><br>
    <input type="radio" name="a" value="5"/>a) answer 1<br/>
    <input type="radio" name="a" value="3"/>b) answer 2<br/>
    <input type="radio" name="a" value="1"/>c) answer 3<br/>
    <br/>
    .
    .
    .
    <strong>15. Question 15</strong><br>
    <input type="radio" name="b" value="5"/>a) answer 1 <br/>
    <input type="radio" name="b" value="3"/>b) answer 2<br/>
    <input type="radio" name="b" value="1"/>c) answer 3<br/>
    <br/>
</form>
<form method="post" name="formularz2" id="Formularz2">
    <strong>16. question16</strong><br>
    <input type="radio" name="p" value="9"/>a) answer 1<br/>
    <input type="radio" name="p" value="7"/>b) answer 2<br/>
    <input type="radio" name="p" value="5"/>c) answer 3<br/>
    <input type="radio" name="p" value="3"/>d) answer 4<br/>
    <input type="radio" name="p" value="1"/>e) answer 5<br/>
    <br/>
    .
    .
    .
    <strong>20. Question 20</strong><br>
    <input type="radio" name="w" value="9"/>answer 1<br/>
    <input type="radio" name="w" value="7"/>answer 2<br/>
    <input type="radio" name="w" value="5"/>answer 3<br/>
    <input type="radio" name="w" value="3"/>d) answer 4<br/>
    <input type="radio" name="w" value="1"/>e) answer 5<br/>
    <br/>
</form>
<button type="button" onclick="checkRadio()">test</button>
<a href="../index.htm"><p align="center">Strona G?ówna</p></a>
<div id="suma"></div>
<div id="suma2"></div>