我正在尝试创建一个生成问题列表的jsp页面。正确地从数据库接收问题并创建适当的div。有55个问题。
我想要做的只是让第一个问题可见,并将其余部分隐藏起来。然后在提交按钮上单击隐藏当前问题[1]并使问题[2]可见。
我在javascript中尝试的任何内容似乎都没有任何影响。有人可以指点我正确的方向吗?
<div id="questionContainer">
<% for (int ques = 1; ques < 56; ques++) {
out.println("<div id ='question" + ques + "' name='question" + ques + "'class='questionVisible'>");
out.println("<h2 class='page-header'>Question" + ques + "</h2>");
if (iterate.hasNext()) {
//out.println(row[0]);
//out.println(row[1]);
//out.println(row[0]);
String[] row = (String[]) iterate.next();
if (row[0].equals("1")) {
out.println("<p id='question'>" + row[1] + "</p><br/>");
out.println("<p id='ansA'><input type='radio' name='answer" + ques + "' value='A' checked>" + row[2] + "</p>");
out.println("<p id='ansA'><input type='radio' name='answer" + ques + "' value='B' checked>" + row[3] + "</p>");
out.println("<p id='ansA'><input type='radio' name='answer" + ques + "' value='C' checked>" + row[4] + "</p>");
out.println("<p id='ansA'><input type='radio' name='answer" + ques + "' value='D' checked>" + row[5] + "</p>");
out.println("<button class='btn' id='btnPAQues" + ques + "' type='button' name='btnPAQues" + ques + "' onclick='onSubmitBtn();'>Submit</button>");
} else if (row[0].equals("2")) {
out.println("<p id='question'>" + row[1] + "</p><br/>");
out.println("<p id='ansA'><input type='radio' name='answer" + ques + "' value='A' checked>" + row[2] + "</p>");
out.println("<p id='ansA'><input type='radio' name='answer" + ques + "' value='B' checked>" + row[3] + "</p>");
out.println("<p id='ansA'><input type='radio' name='answer" + ques + "' value='C' checked>" + row[4] + "</p>");
out.println("<p id='ansA'><input type='radio' name='answer" + ques + "' value='D' checked>" + row[5] + "</p>");
out.println("<p id='ansA'><input type='radio' name='answer" + ques + "' value='E' checked>" + row[6] + "</p>");
out.println("<button class='btn' id='btnPAQues' type='submit' name='submit' onsubmit='onSubmitBtn'>Submit</button>");
} else if (row[0].equals("3")) {
out.println("<p id='question'>" + row[1] + "</p><br/>");
out.println("Answer: <p id='ansA'><input type='text' name='answer" + ques + "'</p><br/><br/>");
out.println("<button class='btn' id='btnPAQues' type='submit' name='submit' onsubmit='onSubmitBtn'>Submit</button>");
}
}
out.println("</div>");
}
%>
</div>
<script>
for(int x= 2; x <56; x++)
{
document.getElementById("question"+x).style.visibility = "questionHidden;";
}
document.getElementById("btnPAQues1").onclick = onSubmitBtn();
function onSubmitBtn() {
document.getElementById("question1").style.visibility = "hidden;";
}
</script>
答案 0 :(得分:1)
尝试这个想法: 首先显示所有问题 为每个问题添加一个div
<div class="trigger" > <p id="question">...Submit</button> </div>
然后添加这个JS代码:
$(".trigger:first").show();
$("button").click(function() {
var $next = $(".trigger:visible").hide().next(".trigger");
if (!$next.length)
$next = $(".trigger:first");
$next.show();
});
答案 1 :(得分:0)
不要使用Javascript来写出问题。将所有问题放在标准HTML中,使用最初隐藏它的CSS类,问题1除外。然后在每次提交时使相应的一个可见,同时隐藏前一个。
您可以使用网络服务吗?执行此操作的常用方法是使用JSP设置页面,然后使用Javascript为每个问题调用Web服务。所以当页面加载调用第一个问题时。当用户单击下一个的提交调用时。等等。