JavaScript重定向到错误的页面
[英]Javascript redirecting to wrong page
问题描述
So I'm creating a simple 1 question multiple choice quiz and depending on the answer submitted I want it to redirect the user to a corresponding page. 
因此，我正在创建一个简单的1问题多选测验，并根据提交的答案将其重定向到相应的页面。 However, my problem is that no matter what input I submit I'm directed to the same page even if I submit the correct answer. 但是，我的问题是，无论我提交了什么输入，即使我提交了正确的答案，我也被定向到同一页面。 Can someone scan through my code to see if maybe its a slight syntax error that I'm missing. 有人可以浏览我的代码以查看是否可能是我遗漏的轻微语法错误。
Code: 码：
<!DOCTYPE html PUBLIC "-//w3c//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml-strict.dtd">
<html>
<head>
<title>International Business</title>
<style type="text/css">
.myIndent{
margin-left: 2em;
}
</style>
<script type="text/javascript">
function submitQuestion(){
var response = document.getElementById('answer').value;
if (response == 'C'){
location="correct.html";
} else {
location="wrong.html";
}
return false;
}
</script>
</head>
<body>
<form>
<p>31.) As long as international businesses _________, Islamic countries are likely to be receptive to those businesses.</p>
<div class="myIndent">
<label>A.)<input type="radio" name="answer" id="answer" value="A">employ Muslim people</label><br />
<label>B.)<input type="radio" name="answer" id="answer" value="B">have property in an Islamic nation<label><br />
<label>C.)<input type="radio" name="answer" id="answer" value="C">behave in a manner that is consistent with Islamic ethics</label><br />
<label>D.)<input type="radio" name="answer" id="answer" value="D">adhere to Islamic beliefs</label><br />
</div>
<br /><br />
<input type="submit" value="Submit" onclick="return submitQuestion()">
<input type="reset" value="Cancel">
</form>
</body>
</html>
Edit: even when I change the line if(response=='C') to if(response=="C") i still have the same problem 编辑：即使我将if(response=='C')更改为if(response=="C")我仍然遇到相同的问题
3 个解决方案
解决方案1
3 2014-11-14 16:35:16
You can only have 1 ID. 您只能有1个ID。 document.getElementById('answer'); will get the first element it comes to. 将得到它涉及的第一个元素。
Advice 忠告
Unless your students are in elementary school, I cannot advise that you should write a quiz like this; 除非你的学生在小学，否则我不建议你写这样的测验。 unless its more of an exercise to learn the right answer. 除非更多的练习是学习正确的答案。 If it's grading based on regurgitation, then there are too many ways for someone to happen upon the answer without having to read the question. 如果它是基于返流分级，然后有专人在答案发生 ，而不必阅读问题太多的方法。
function submitQuestion() {
var possible_answers = document.getElementsByName('answer');
var selection;
for (var i=0,n=possible_answers.length; i<n; i++){
if(possible_answers[i].checked === true){
selection = possible_answers[i].value;
break;
}
}
if (selection == 'C') {
window.location = "correct.html";
} else {
window.location = "wrong.html";
}
return false;
}
Fixed HTML Syntax: 固定的HTML语法：
<form>
<p>31.) As long as international businesses _________, Islamic countries are likely to be receptive to those businesses.</p>
<div class="myIndent">
<label>A.)<input type="radio" name="answer" value="A" />employ Muslim people</label>
<label>B.)<input type="radio" name="answer" value="B" />have property in an Islamic nation</label>
<label>C.)<input type="radio" name="answer" value="C" />behave in a manner that is consistent with Islamic ethics</label>
<label>D.)<input type="radio" name="answer" value="D" />adhere to Islamic beliefs</label>
</div>
<input type="submit" value="Submit" onclick="return submitQuestion();">
<input type="reset" value="Cancel">
</form>
A little more CSS: 一些CSS：
.myIndent {
margin-left: 2em;
margin-bottom: 2em;
}
.myIndent label {
display:block;
}
解决方案2
1 已采纳 2014-11-14 16:44:14
On Label A.), <labe> should be <label> 上标签A.）， <labe>应<label>
On Label B.) you don't have a closing </label> tag 在标签B上。）您没有结束</label>
You can't have multiple elements with the same ID "answer" 您不能有多个具有相同ID“ answer”的元素
Try something like this: 尝试这样的事情：
function submitQuestion() {
var response = document.getElementsByName('answer');
for (var i = 0; i < response.length; i++) {
if (response[i].checked) {
response = response[i].value;
}
}
if (response == 'C') {
location = "correct.html";
}
else {
location = "wrong.html";
}
return false;
}
This function gets all of the elements with the name "answer" in the radio group. 此功能获取单选组中所有名称为“ answer”的元素。 Then checks if the correct one is selected. 然后检查是否选择了正确的一个。
Here is the complete code: 这是完整的代码：
<html>
<head>
<title>International Business</title>
<style type="text/css">
.myIndent{
margin-left: 2em;}
</style>
<script type="text/javascript">
function submitQuestion() {
var response = document.getElementsByName('answer');
for (var i = 0; i < response.length; i++) {
if (response[i].checked) {
response = response[i].value;
}
}
if (response == 'C') {
location = "correct.html";
}
else {
location = "wrong.html";
}
return false;
}
</script>
</head>
<body>
<form>
<p>31.) As long as international businesses _________, Islamic countries are likely to be receptive to those businesses.</p>
<div class="myIndent">
<label>A.)<input type="radio" name="answer" id="answerA" value="A" />employ Muslim people</label><br />
<label>B.)<input type="radio" name="answer" id="answerB" value="B" />have property in an Islamic nation</label><br />
<label>C.)<input type="radio" name="answer" id="answerC" value="C" />behave in a manner that is consistent with Islamic ethics</label><br />
<label>D.)<input type="radio" name="answer" id="answerD" value="D" />adhere to Islamic beliefs</label><br />
</div>
<br /><br />
<input type="submit" value="Submit" onclick="return submitQuestion()">
<input type="reset" value="Cancel">
</form>
</body>
</html>
解决方案3
0 2014-11-14 16:44:07
Use class instead of id 使用类而不是ID
<div class="myIndent">
<labe>A.)<input type="radio" name="answer" class="answer" value="A">employ Muslim people</label><br />
<label>B.)<input type="radio" name="answer" class="answer" value="B">have property in an Islamic nation<label><br />
<label>C.)<input type="radio" name="answer" class="answer" value="C">behave in a manner that is consistent with Islamic ethics</label><br />
<label>D.)<input type="radio" name="answer" class="answer" value="D">adhere to Islamic beliefs</label><br />
</div>
However, you dont need to even give a class to all. 但是，您甚至不需要给所有人上课。 Get checked radio button by name 按名称获取选中的单选按钮
var response = document.getElementsByName('answer').checked;
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.