我正在创建一个类似调查的页面。我使用了三个基本的javascript函数,goNext(i)
隐藏了某个div标签并显示了下一个goPrevious(i)
,它几乎相同但后退,answerExists(questionNumber)
检查所有单选按钮检查。从我创建的answerExists(), goNext()
和我想goPrevious()
的点开始,停止响应。也许它与onsubmit()
函数有关,但我无法弄明白。这些是Javascript函数:
function goNext(i) {
document.getElementById("div" + i).style.display = 'none';
document.getElementById("div" + (i + 1)).style.display = 'block';
}
function goPrevious(i) {
document.getElementById("div" + i).style.display = 'none';
document.getElementById("div" + (i - 1)).style.display = 'block';
}
function checkAnswers(questions) {
var answers = new Array(questions);
for(var i = 1; i <= questions; i++){
answers[i-1] = false;
var radio = document.getElementsByClassName('Radio' + i);
for (var j=0; j < radio.length; j++) {
if(radio[j].checked == true)
alert(radio[j].value)answers[i-1] = true;
}
for (var i = 0; i < questions; i++){
if(answers[i] == false){
alert("Please answer all questions.");
return false;
}
}
return true;
}
这是HTML表单:
<form id="content" action="getresults.jsp" method="post" onsubmit="return checkAnswers(2);">
<div id="div1" style="display: block;">
<strong>1. Question 1</strong><br><br>
<input id="radio1" class="radio1" name="radio1" onclick="if (this.__chk) this.checked = false" onmousedown="this.__chk = this.checked" type="radio" value="Answer1" />
Answer1<br><br><br><br>
<div class="auto-style1">
<input name="next" onclick="goNext(1);" type="button" value="Next" />
</div>
</div>
<div id="div2" style="display: none;">
<strong>2. Question 2</strong><br><br>
<input id="radio2" class="radio2" name="radio2" onclick="if (this.__chk) this.checked = false" onmousedown="this.__chk = this.checked" type="radio" value="Answer 2" />
Answer 2<br><br>
<input id="radio2" class="radio2" name="radio2" onclick="if (this.__chk) this.checked = false" onmousedown="this.__chk = this.checked" type="radio" value="dfgdgfdgf" />
dgfgddgf<br><br><br><br>
<div class="auto-style1">
<input name="previous" onclick="goPrevious(2);" type="button" value="Previous" />
<input name="submit" type="submit" value="Submit" />
</div>
</div>
</form>
它实际上都是动态创建的,但在我添加checkAnswers()
函数之前它仍然有效。
答案 0 :(得分:3)
问题是你的checkAnswers
函数中存在语法错误,并且解释器会丢弃包含语法错误的所有脚本,因此所有其他函数也会被丢弃。
这是两个语法错误:
alert(radio[j].value)answers[i-1] = true;
不是有效的陈述。 (我猜你打算删除alert(radio[j].value)
部分,但突出了错误的内容?){
而不是右大括号}
。一旦解决了这两个问题,脚本至少应该运行(尽管你可能还有一些调试要做)。
答案 1 :(得分:1)
您正在使用2作为参数调用checkAnswers并使用它构建一个数组。 ????
以下代码将显示错误。
try{
//your code
}catch(er){
alert(er);
}
答案 2 :(得分:0)
我想一步一步地回答你......
1)为什么你真的需要检查是否检查了所有问题的答案? 我问你这个,因为单选按钮会默认选择一个选项...或者你可以为特定选项做一个“活动”的事情......通过这样做你真的不需要检查是否所有问题都得到了回答。 ..因为默认选择一个答案......
2)点击事件无效,因为您似乎没有任何“id”用于输入标签“next”,“previous”,“submit”...每个都有单独的id并捕获点击事件那个特定的标签使用jquery ......
例如。拥有下一个<input id="next">
$("#next").click(function() {
//perform the action you need
}
对所有点击事件执行此操作....
3)最后......不要对你想点击的元素使用输入标签...尝试使用按钮标签...
希望它会帮助你:))