|
|
@@ -1,263 +0,0 @@
|
|
|
-<!DOCTYPE html>
|
|
|
-<html lang="en">
|
|
|
- <head>
|
|
|
- <meta charset="UTF-8" />
|
|
|
- <title>template</title>
|
|
|
- <style>
|
|
|
- .center {
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- .left_small {
|
|
|
- margin-left: 10px;
|
|
|
- }
|
|
|
- .left_sm {
|
|
|
- margin-left: 30px;
|
|
|
- }
|
|
|
- .top_small {
|
|
|
- margin-top: 10px;
|
|
|
- }
|
|
|
- .firstPage {
|
|
|
- /*设置高度和宽度*/
|
|
|
- margin-left: 50px;
|
|
|
- width: 2250px;
|
|
|
- position: relative;
|
|
|
- }
|
|
|
- .firstColumn {
|
|
|
- /*设置高度和宽度*/
|
|
|
- width: 1630px;
|
|
|
- height: 120px;
|
|
|
- /*绝对定位到中间*/
|
|
|
- overflow: auto;
|
|
|
- margin: auto;
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- bottom: 0;
|
|
|
- right: 0;
|
|
|
- /* 逆时针旋转90度 */
|
|
|
- transform: rotateZ(270deg);
|
|
|
- /*往左平移*/
|
|
|
- margin-right: 60.5%;
|
|
|
- margin-top: 34%;
|
|
|
- }
|
|
|
- #allContent {
|
|
|
- width: 2000px;
|
|
|
- float: left;
|
|
|
- margin-left: 145px;
|
|
|
- }
|
|
|
- .content-page {
|
|
|
- overflow: hidden;
|
|
|
- height: 1660px;
|
|
|
- float: left;
|
|
|
- width: 990px;
|
|
|
- position: relative;
|
|
|
- border-bottom: 1px dashed black;
|
|
|
- }
|
|
|
- .secondColumn {
|
|
|
- float: left;
|
|
|
- width: 990px;
|
|
|
- padding-top: 10px;
|
|
|
- margin-top: 5px;
|
|
|
- margin-left: 6px;
|
|
|
- margin-right: 50px;
|
|
|
- }
|
|
|
- /* 侧边栏 */
|
|
|
- .sidebar-font {
|
|
|
- margin-top: 10px;
|
|
|
- margin-left: 70px;
|
|
|
- }
|
|
|
- /* 密封线*/
|
|
|
- .sidebar-thread {
|
|
|
- margin-top: 10px;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- .paper_title {
|
|
|
- height: 184px;
|
|
|
- }
|
|
|
- #optionContent {
|
|
|
- visibility: hidden;
|
|
|
- width: 990px;
|
|
|
- }
|
|
|
- .item-option-4 {
|
|
|
- width: 100%;
|
|
|
- }
|
|
|
- .item-option-2 {
|
|
|
- width: 50%;
|
|
|
- }
|
|
|
- .item-option-1 {
|
|
|
- width: 25%;
|
|
|
- }
|
|
|
- .item-option {
|
|
|
- display: inline-block;
|
|
|
- line-height: 20px;
|
|
|
- }
|
|
|
- </style>
|
|
|
- </head>
|
|
|
- <body>
|
|
|
- <div class="firstPage" id="firstPage">
|
|
|
- <!-- 密封线 -->
|
|
|
- <div class="firstColumn">
|
|
|
- <div class="sidebar-font">
|
|
|
- <span>姓名________________________________</span>
|
|
|
- <span>学号________________________________</span>
|
|
|
- <span>专业________________________________</span>
|
|
|
- <span>学习中心________________________________</span>
|
|
|
- <span>考试名称________________________________</span>
|
|
|
- </div>
|
|
|
- <div class="sidebar-thread">
|
|
|
- <span
|
|
|
- >...........................................................................................密...........................................................................................封..............................................................................线..............................................................................</span
|
|
|
- >
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <!-- 选项临时存放点 -->
|
|
|
- <div id="optionContent"></div>
|
|
|
- <div id="allContent">
|
|
|
- <div class="content-page" id="content-page">
|
|
|
- <div class="secondColumn" id="secondColumn0">
|
|
|
- <div class="paper_title">
|
|
|
- <div>
|
|
|
- <h1>
|
|
|
- <span style="margin-left:20%;">网络教育学院考试</span>
|
|
|
- </h1>
|
|
|
- <h3><span style="margin-left:35%;">考试试卷</span></h3>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <span>课程名称：</span
|
|
|
- ><span style="color: #FF0000" id="courseName"></span>
|
|
|
- <span style="margin-left: 20px;">课程代码：</span
|
|
|
- ><span style="color: #FF0000" id="courseNo"></span><br />
|
|
|
- </div>
|
|
|
- <div class="top_small">
|
|
|
- <span
|
|
|
- >注意事项：必须按试题顺序在“答题卡”上按要求填涂、作答，答在试卷上的答案无效。</span
|
|
|
- >
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="top_small"></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </body>
|
|
|
- <script>
|
|
|
-
|
|
|
- var a3width = 990; //a3宽
|
|
|
- var a3height = 1660; //a3高
|
|
|
-
|
|
|
- var secondColumnIndex = 0;
|
|
|
- var pageSize = 1;
|
|
|
- var optionArray = [];
|
|
|
- var secondColumn = document.getElementById(
|
|
|
- "secondColumn" + secondColumnIndex
|
|
|
- );
|
|
|
- var optionContent = document.getElementById("optionContent");
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- function initialize(dataList,courseName,courseNo) {
|
|
|
- document.getElementById("courseName").innerHTML = courseName;
|
|
|
- document.getElementById("courseNo").innerHTML = courseNo;
|
|
|
- typesetting(dataList);
|
|
|
- }
|
|
|
-
|
|
|
- function typesetting(dataList) {
|
|
|
- for (var i = 0; i < dataList.length; i++) {
|
|
|
- var div = createDivDom(dataList[i], i);
|
|
|
- if (div.className.indexOf("item-option") > -1) {
|
|
|
- optionArray.push(div);
|
|
|
- optionContent.appendChild(div);
|
|
|
- } else if (
|
|
|
- (div.className.indexOf("item-quesBody") > -1 ||
|
|
|
- div.className.indexOf("item-paperDetail") > -1) &&
|
|
|
- optionArray.length > 0
|
|
|
- ) {
|
|
|
- handleQuesOption();
|
|
|
- appendPageBox(div);
|
|
|
- } else {
|
|
|
- appendPageBox(div);
|
|
|
- }
|
|
|
- }
|
|
|
- //如果最后一次是选择题
|
|
|
- if (optionArray.length > 0) {
|
|
|
- handleQuesOption();
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- //处理选项
|
|
|
- function handleQuesOption() {
|
|
|
- var cls = getLineType(optionArray);
|
|
|
- optionContent.innerHTML = "";
|
|
|
- optionArray.forEach(function(item) {
|
|
|
- item.setAttribute("class", "item-option " + cls);
|
|
|
- appendPageBox(item);
|
|
|
- });
|
|
|
- optionArray = [];
|
|
|
- }
|
|
|
-
|
|
|
- function createDivDom(data, index) {
|
|
|
- var divlog = document.createElement("div");
|
|
|
- var spanlog = document.createElement("span");
|
|
|
- var cls = "";
|
|
|
- if (data.indexOf("paperDetailTitle") > -1) {
|
|
|
- cls = "item-paperDetail";
|
|
|
- }
|
|
|
- if (data.indexOf("questionBody") > -1) {
|
|
|
- cls = "item-quesBody";
|
|
|
- }
|
|
|
- if (data.indexOf("selectOption") > -1) {
|
|
|
- cls = "item-option";
|
|
|
- }
|
|
|
- divlog.setAttribute("class", cls);
|
|
|
- divlog.setAttribute("data-index", index);
|
|
|
- spanlog.innerHTML = data;
|
|
|
- divlog.appendChild(spanlog);
|
|
|
- return divlog;
|
|
|
- }
|
|
|
-
|
|
|
- function appendPageBox(dom) {
|
|
|
- secondColumn.appendChild(dom);
|
|
|
- var pch = secondColumn.clientHeight;
|
|
|
- if (pch > a3height) {
|
|
|
- secondColumn.removeChild(dom);
|
|
|
- secondColumnIndex++;
|
|
|
- var allContent = document.getElementById("allContent");
|
|
|
- var contentPageDom = document.createElement("div");
|
|
|
- contentPageDom.setAttribute("class", "content-page");
|
|
|
-
|
|
|
- var pageBoxDom = document.createElement("div");
|
|
|
- pageBoxDom.setAttribute("class", "secondColumn");
|
|
|
- pageBoxDom.id = "secondColumn" + secondColumnIndex;
|
|
|
- pageBoxDom.appendChild(dom);
|
|
|
- contentPageDom.appendChild(pageBoxDom);
|
|
|
- allContent.appendChild(contentPageDom);
|
|
|
- secondColumn = document.getElementById(
|
|
|
- "secondColumn" + secondColumnIndex
|
|
|
- );
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- function getLineType(optionWs) {
|
|
|
- var type = "item-option-1";
|
|
|
- for (var i = 0; i < optionWs.length; i++) {
|
|
|
- var rate = optionWs[i].clientWidth / a3width;
|
|
|
- if (rate > 0.5) {
|
|
|
- type = "item-option-4";
|
|
|
- return type;
|
|
|
- }
|
|
|
- if (rate > 0.25) type = "item-option-2";
|
|
|
- }
|
|
|
- return type;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- window.onload = function () {
|
|
|
-
|
|
|
- var dateList = eval(${htmlList!});
|
|
|
-
|
|
|
- initialize(dateList,"${courseName!}","${courseNo!}");
|
|
|
- };
|
|
|
-
|
|
|
- </script>
|
|
|
-</html>
|
deason