js封装用户选项传递给Servlet之考试系统二
<%@ page language="java" import="java.util.*" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>微冷的雨考试成绩统计系统</title>
<style type="text/css"> body{
font-size:30px;
background:#DAE4F6;
font-family:"楷体";
} #container{
margin:0px auto;
} #box{
/* border:1px solid red; */
overflow:hidden;
margin:0px auto;
} #box label{
margin-top:5px;
background:#B0E0E6;
width:80px;
display:inline-block;
text-align:right;
margin-left:50px;
}
</style>
<script type="text/javascript">
//获取用户已经做了的题目
//获取所有的复选框
var data=new Array();
function selectCheckBox(){
//定义一个字典保存题目编号和用户填写的答案 /* data.push=function(o){
//如果o是object
if(typeof(o)=='object') for(var p in o) this[p]=o[p];
}; */ // data.push({2:"A"});
//alert(data.a)
var selectnum = 0;
var mycheckboxs = document.getElementsByTagName("input");//获取所有的input标签对象
var checkboxArray = [];//初始化空数组，用来存放checkbox对象。
for(var i=0;i<mycheckboxs.length;i++){
var obj = mycheckboxs[i];
if(obj.type=='checkbox'){
checkboxArray.push(obj);
}
}
for(var i=0;i<checkboxArray.length;i++){
if(checkboxArray[i].checked){
//选择了某个复选框
selectnum++;
//复选框提交的文本
var tidAndAnswer=checkboxArray[i].value;
var myarray=tidAndAnswer.split(":");
//题目
var tid = parseInt(myarray[1]);
//答案
var useranswer = myarray[0];
var flag=false;
data[0] = "";
//看题目编号是否已经被记录
for ( var item in data) {
if(item!=0){
if(item==tid){
data[item]=data[item]+useranswer;
flag=true;
break;
}
}
}
if(flag==false){
//data.push({tid:useranswer});
data[tid]=tid+":"+useranswer;
} }
} //
if (selectnum==0){
alert('请至少做一道题目');
return false;
}else{
return true;
}
//
}
//表单校验 function checkName(){
var txtName=document.getElementById("txtName");
if(txtName.value==""||txtName.value==null){
alert('请输入姓名');
return false;
}
return true;
} //加载完所有的标签，图片和css后执行
window.onload=function(){ var myform=document.getElementById("form1");
var mydata=document.getElementById("selectData");
myform.onsubmit=function(){
var mycount=0;
if(!checkName()){
mycount--;
}else{
if(!selectCheckBox()){
mycount--;
}
} if(mycount==0){
//var str = JSON.stringify(data);
//alert(str);
mydata.value=data;
return true;
}else{
return false;
} }; var row=15;
var col=2;
var mybody=document.getElementById('mybody');
if(col>4){
mybody.style.width=document.body.scrollWidth+(col-4)*350;
} //mybody.style.width="3333px";
initOptions(row,col);
//alert(body.documentElement.clientWidth);
// document.body.scrollWidth=3333;
var cbxs=document.getElementsByName("rchoice");
for ( var i = 0; i < cbxs.length; i++) {
cbxs[i].style.cssText="margin-left:20px;";
}
};
//动态加载答题区控件！
function initOptions(row,column){
var box=document.getElementById('box');
//题目编号，从0开始
var count = 0;
var mytag; //CheckBox的Tag属性值
//
for (var i = 1; i <=row ; i++){ //默认i的值为15
count++;
var mydiv=document.createElement("div");
box.appendChild(mydiv);
//mydiv.style.border="1px solid blue";
// mydiv.style.paddingRight="700px";
mydiv.style.overflow="auto";
for (var j = 1; j <=column; j++){ //默认j的值为2
//创建一个label
var label=document.createElement('label'); //设置座位号
if (j == 1)
{
label.innerHTML = count+ "题";
mytag = count;
}
else
{
//多列的情况下创建题目编号的方式
label.innerHTML = (count +row*(j-1)) + "题";
mytag = count + row*(j-1);
}
var littlediv=document.createElement("div");
littlediv.style.float="left"; //littlediv.style.border="3px solid blue";
mydiv.appendChild(littlediv);
littlediv.appendChild(label);
//创建四个选项
var checkbox1=document.createElement("input");
checkbox1.setAttribute("type","checkbox");
checkbox1.setAttribute("value","A:"+mytag);
checkbox1.setAttribute("name","rchoice");
var cbtxt=document.createTextNode("A");
littlediv.appendChild(checkbox1);
littlediv.appendChild(cbtxt); //第二个checkbox
var checkbox2=document.createElement("input");
checkbox2.setAttribute("type","checkbox");
checkbox2.setAttribute("value","B:"+mytag);
checkbox2.setAttribute("name","rchoice");
var cbtxt2=document.createTextNode("B");
littlediv.appendChild(checkbox2);
littlediv.appendChild(cbtxt2);
//第三个checkbox
var checkbox3=document.createElement("input");
checkbox3.setAttribute("type","checkbox");
checkbox3.setAttribute("value","C:"+mytag);
checkbox3.setAttribute("name","rchoice");
var cbtxt3=document.createTextNode("C");
littlediv.appendChild(checkbox3);
littlediv.appendChild(cbtxt3); //第四个checkbox
var checkbox4=document.createElement("input");
checkbox4.setAttribute("type","checkbox");
checkbox4.setAttribute("value","D:"+mytag);
checkbox4.setAttribute("name","rchoice");
var cbtxt4=document.createTextNode("D"); littlediv.appendChild(checkbox4);
littlediv.appendChild(cbtxt4);
var myline=document.createElement("br"); if(j==column){
mydiv.appendChild(myline);
}
}
} } </script>
</head> <body id="mybody">
<div id="container">
<div id="box"> </div>
<form action="${pageContext.request.contextPath}/SaveServlet?action=save" method="post" id="form1"> <!-- <fieldset>
<legend>答题区 :本软件由微冷的雨出品!如有问题，请发送反馈信息到：yymqqc@126.com</legend> --> <div id="tool">
<label for="txtRow" >行:</label><input id="txtRow" type="text" style="width:50px;"/>
<label for="txtColumn" >列:</label><input id="txtColumn" type="text" style="width:50px;"/>
<input type="button" value="生成"/>
<label for="txtName" >姓名:</label><input id="txtName" name="txtName" type="text"/>
<c:if test="${not empty errors && not empty errors['txtName']}">
<span class="error">${errors['txtName']}</span>
</c:if>
<c:if test="${empty errors || empty errors['txtName']}"><span></span></c:if>
<input type="submit" value="提交"/>
</div>
<input type="hidden" id="selectData" name="selectData" value=""/>
</form>
<!-- </fieldset> -->
</div>
</body>
</html>
js封装用户选项传递给Servlet之考试系统二的更多相关文章
- JavaWeb -- 服务器传递给Servlet的对象 -- ServletConfig, ServletContext,Request, Response
1. ServletConfig 有一些东西不合适在程序中写死,应该写在web.xml中,比如 文字怎么显示, 访问数据库名 和 密码, servlet要读取的配置文件 等等.. l在Servle ...
- 关于js封装框架类库之DOM操作模块（二）
上一篇基本实现了框架结构,但是与真正能用上的项目框架比较还是存在很多不足,在这又做了些加强与优化 (function ( window, undefined ) { var arr = [], pus ...
- jsbridge的js封装
/*注意:源生app需要配置jsbridge的环境,而在前端页面中需要下方封装代码,既可以达到调用app方法的功能和注册供app调用的方法1.注册方法:注册后,供app调用,注册时,同名函数,下一个会 ...
- JS图片上传预览插件制作（兼容到IE6）
其实,图片预览功能非常地常见.很意外,之前遇到上传图片的时候都不需要预览,也一直没有去实现过.现在手上的项目又需要有图片预览功能,所以就动手做了一个小插件.在此分享一下思路. 一.实现图片预览的一些方 ...
- 如何获取url中的参数并传递给iframe中的报表
在使用报表软件时,用户系统左边一般有目录树,点击报表节点就会在右侧网页的iframe中显示出报表,同时点击的时候也会传递一些参数给网页,比如时间和用户信息等.如何使网页中的报表能够获取到传递过来的参数 ...
- 原生JS封装Ajax插件(同域&&jsonp跨域)
抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...
- 用jQuery基于原生js封装的轮播
我发现轮播在很多网站里面都用到过,一个绚丽的轮播可以为网页增色不少,最近闲来无事,也用原生js封装了一个轮播,可能不像网上的插件那么炫,但是也有用心去做.主要用了闭包的思想.需要传递的参数有:图片地址 ...
- jquery的uploadify上传jsp+servlet
1.准备材料:下载jquery.uploadify上传js 注意:这个上传在firefox下会出现问题如果你在项目中加了拦截器,因为session会丢失,所以你可以传参的时候带上你所需要的条件,在 ...
- JS封装cookie操作函数实例(设置、读取、删除)
本文实例讲述了JS封装cookie操作函数.分享给大家供大家参考,具体如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 ...
随机推荐
- RumTime实践之－－UITableView和UICollectionView缺省页的实现
有关RunTime的知识点已经看过很久了,但是一直苦于在项目中没有好的机会进行实际运用,俗话说"光说不练假把式",正好最近在项目中碰到一个UITableView和UICollect ...
- Spartan Exploit Kit分析
之前都是调试flash的漏洞,相关的样本接触较少,碰巧看到一篇不错的分析,尝试了一下,留个记录. 调试flasher样本一般建议使用调试版的flash player,在调试版本下可以输出swf文件运行 ...
- .NET程序运行过程产生的问题
1.数据兼容性 功能模块的开发,会影响历史数据以及新数据的更新和体现.比如开发功能007,007支持了金额可变,数量不可变的原理.而历史数据均是数量可变,金额不可变的原理.此时,就会产生了问题. 2. ...
- log4j:WARN Please initialize the log4j system properly 问题解决
log4j:WARN No appenders could be found for logger (com.netease.qa.testng.TestngRetry).log4j:WARN Ple ...
- [8.2] Robot in a Grid
Imagine a robot sitting on the upper left corner of grid with r rows and c columns. The robot can on ...
- Mybatis总结
jdbc.properties driver=com.mysql.jdbc.Driver url=jdbc:mysql://127.0.0.1:3306/testdb username=root pa ...
- NOI 题库 9272 题解
9272 偶数个数字3 描述 在所有的N位数中,有多少个数中有偶数个数字3? 输入 一行给出数字N,N<=1000 输出 如题 样例输入 2 样例输出 73 Solution : 令f ( ...
- bootstrap之强调文本的类（带颜色）
bootstrap之强调文本的类(带颜色) <small>本行内容是在标签内</small><br> <strong>本行内容是在标签内</str ...
- 两种让tableview返回顶部的方法
1. [self.tableView selectRowAtIndexPath:[NSIndexPath indexPathForRow:_currentRow inSection:0] animat ...
- python中__init__问题
python中安装目录中的Lib文件夹模块中的__init__.py文件(文件内容可以为空),用于标识此文件夹是一个模块 python编程中的__init__表示初始化