test

2018-05-30 15:31:33 +08:00
commit 4815ee7832
34 changed files with 18348 additions and 0 deletions
--- a/css/biankuang.css
+++ b/css/biankuang.css
@@ -0,0 +1,72 @@
+.spbq{
+    width: 100%;
+    height: auto;
+    padding: 0 10px 10px 15px;
+    margin: 5px 0;
+    /*importance*/
+    position: relative;
+    overflow: hidden;
+}
+/*边框特效*/
+.biankuang{
+    width: 3px;
+    height: 3px;
+    position: absolute;
+    z-index: 99;
+    border-radius:10px;
+    /*background: black;*/
+}
+.biankuang_1{
+    /*left*/
+    height: 3px;
+    top: -6px;
+    left:0px;
+    border-left: 3px solid #EB5858;
+}
+.biankuang_2 {
+    /*bottom*/
+    width: 0px;
+    bottom: -1px;
+    left: 0px;
+    border-top: 3px solid #EB5858;
+}
+.biankuang_3{
+    /*right*/
+    height: 0px;
+    bottom:0px;
+    right:0px;
+    border-right: 3px solid #EB5858;
+}
+.biankuang_4{
+    /*top*/
+    width:0px;
+    top:-1px;
+    right:0px;
+    border-bottom: 3px solid #EB5858;
+}
+.text_gobuy {
+    position: absolute;
+    z-index:9;
+    top: -30px;
+    left: 0px;
+    width: 280px;
+    height: 50px;
+    overflow: hidden;
+    background:rgba(207, 208, 211, 0);
+    cursor: pointer;
+    transition:all  300ms;
+    -webkit-transition:all  300ms;
+    -moz-transition:all  300ms;
+    -o-transition:all  300ms;
+}
+.text_gobuy_show{
+    height: 50px;
+    position: absolute;
+    z-index:9;
+    bottom: 0px;
+    width: 280px;
+    overflow: hidden;
+    padding: 20px 15px ;
+    cursor: pointer;
+    background-color: rgba(32, 32, 33,0.3);
+}
--- a/css/header.css
+++ b/css/header.css
@@ -0,0 +1,65 @@
+.Sticky.is-fixed {
+    position: fixed;
+    z-index: 2;
+    box-sizing: border-box
+}
+
+.AppHeader {
+    position: relative;
+    overflow: hidden;
+    background: #fff;
+    border-bottom: 1px solid rgba(30, 35, 42, .06);
+    box-shadow: 0 1px 3px 0 rgba(0, 34, 77, .05);
+    background-clip: content-box
+}
+
+.AppHeader,
+.AppHeader.is-fixed {
+    z-index: 100
+}
+
+.AppHeader-inner {
+    position: relative;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    width: 1000px;
+    height: 60px;
+    padding: 0 16px;
+    margin: 0 auto;
+	-webkit-box-sizing: content-box;
+	-moz-box-sizing: content-box;
+	box-sizing: content-box;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-transition: -webkit-transform.3s;
+    transition: -webkit-transform.3s;
+    transition: transform.3s;
+    transition: transform.3s, -webkit-transform.3s
+}
+
+.AppHeader.is-hidden .AppHeader-inner{
+	-webkit-transform:translateY(-100%);
+	transform:translateY(-100%)
+}
+
+.PageHeader {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	-webkit-transition: -webkit-transform.3s;
+	transition: -webkit-transform.3s;
+	transition: transform.3s;
+	transition: transform.3s, -webkit-transform.3s;
+	-webkit-box-sizing: content-box;
+	-moz-box-sizing: content-box;
+	box-sizing: content-box;
+}
+
+.PageHeader:not(.is-shown){
+	-webkit-transform: translateY(100%);
+	transform: translateY(100%)
+}
--- a/css/materialize.css
+++ b/css/materialize.css
--- a/css/style.css
+++ b/css/style.css
@@ -0,0 +1,341 @@
+/*
+ * Override Bootstrap's default container.
+ */
+body {
+	font-family: "Helvetica Neue", "Helvetica", "Lucida Grande", "Arial", "Hiragino Sans GB", "Tahoma", "Microsoft Yahei", "SimSun", "WenQuanYi Micro Hei", "sans-serif";
+	font-weight: normal;
+	padding-top: 50px;
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+}
+a {
+	color: #D14747;
+}
+a:hover, a:focus {
+	color: #DA1D1D;
+	text-decoration: none;
+}
+a:active {
+	color: darkred;
+}
+pre {
+	border: none;
+	background-color: transparent;
+}
+.jumbotron {
+	text-align: center;
+	background-color: #cf4646;
+	color: #fff;
+	position: relative;
+	flex: 1 0 auto;
+}
+.jumbotron .video-js {
+	text-align: center;
+	margin: auto;
+}
+.jumbotron .lead em {
+	display: none;
+}
+.jumbotron .logo {
+	width: 100%;
+	max-width: 200px;
+}
+.jumbotron .btn-getting-started {
+	color: #efbfbf;
+	border: none;
+	box-shadow: inset 0 0 0 2px #efbfbf;
+	border-radius: 2px;
+	background-color: transparent;
+	margin-top: 26px;
+}
+.jumbotron .btn-getting-started:hover, .jumbotron .btn-getting-started:active {
+	color: #fff;
+	box-shadow: inset 0 0 0 2px #fff;
+	background-color: transparent;
+}
+
+@media (min-width: 768px) {
+.site-navbar .navbar-nav {
+	float: right!important;
+}
+}
+.navbar-inverse {
+	background-color: #cf4646;
+	border-color: transparent;
+	flex: 0 0 auto;
+}
+.navbar-inverse .navbar-brand {
+	color: #efefef;
+}
+.navbar-inverse .navbar-nav > li > a {
+	color: #e8e8e8;
+}
+.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:focus, .navbar-inverse .navbar-nav > .active > a:hover {
+	color: #fff;
+	background-color: transparent;
+}
+.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
+	border-color: #CA3131;
+}
+.navbar-inverse .navbar-toggle {
+	border-color: #fff;
+}
+.navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus {
+	background-color: transparent;
+}
+.footer {
+	margin-top: 60px;
+	text-align: center;
+	color: #888888;
+	flex: 0 0 auto;
+	font-size: 90%;
+}
+.footer a {
+	color: inherit;
+}
+.footer a:hover {
+	text-decoration: none;
+	color: inherit;
+}
+.docs-wrapper {
+	margin-top: 30px;
+}
+.benefits h2 {
+	margin-top: 40px;
+	line-height: 18pt;
+	padding-left: 10px;
+	border-left: 3px solid red;
+	margin-right: 0px;
+	margin-left: auto;
+	margin-bottom: 20px;
+}
+.benefits p {
+	font-size: 18px;
+}
+.markdown-body {
+	font-size: 16px;
+	line-height: 1.8;
+}
+.markdown-body h1 {
+	border-left: 3px solid #EF2E31;
+	line-height: 30px;
+	padding-left: 10px;
+}
+.markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6 {
+	margin-top: 1.2em;
+	margin-bottom: 0.6em;
+	line-height: 1.35;
+	font-family: "Microsoft Yahei", Tahoma, Helvetica, Arial, "SimSun", sans-serif;
+}
+.markdown-body h6, .markdown-body h5 {
+	font-size: 18px;
+}
+.markdown-body p, .markdown-body pre, .markdown-body ul, .markdown-body ol, .markdown-body dl, .markdown-body form, .markdown-body hr, .markdown-body table, .markdown-body blockquote {
+	margin-bottom: 1.2em;
+}
+.markdown-body time {
+	margin-bottom: 1.2em;
+}
+.markdown-body img {
+	display: block;
+	max-width: 100%;
+	height: auto;
+}
+.markdown-body a {
+	text-decoration: none;
+	color: #D14747;
+}
+.markdown-body a:hover {
+	text-decoration: none;
+	color: #DA1D1D;
+}
+.markdown-body a:active, .markdown-body a:visited {
+	color: darkred;
+}
+.markdown-body blockquote {
+	margin: 1em 0 1em 0;
+	padding: 0 0 0 1.6em;
+}
+.markdown-body blockquote small {
+	display: inline-block;
+	margin: 0.8em 0 0.8em 1.5em;
+	font-size: 0.9em;
+}
+.markdown-body pre {
+	font-size: 14px;
+	border: none;
+	border-radius: 0;
+}
+.markdown-body hr {
+	border-top: 1px solid #e5e5e5;
+}
+.markdown-body li ul, .markdown-body li ol {
+	margin-bottom: 0.8em;
+}
+/* Loadingbar */
+#loadingbar {
+	position: fixed;
+	z-index: 2147483647;
+	top: 0;
+	left: -6px;
+	width: 1%;
+	height: 3px;
+	background-color: rgba(155,210,57,1.00);
+	-moz-border-radius: 1px;
+	-webkit-border-radius: 1px;
+	border-radius: 1px;
+	-moz-transition: all 500ms ease-in-out;
+	-ms-transition: all 500ms ease-in-out;
+	-o-transition: all 500ms ease-in-out;
+	-webkit-transition: all 500ms ease-in-out;
+	transition: all 500ms ease-in-out;
+}
+
+#loadingbar.left {
+  left: 100%;
+  right: 0px;
+  width: 100%;
+}
+
+#loadingbar.up {
+  left: 0px;
+  top: 100%;
+  width: 5px;
+  bottom: 0px;
+  height: 100%;
+}
+
+#loadingbar.down {
+  left: 0;
+  width: 5px;
+  height: 0;
+}
+
+#loadingbar.waiting dd, #loadingbar.waiting dt {
+  -moz-animation: pulse 2s ease-out 0s infinite;
+  -ms-animation: pulse 2s ease-out 0s infinite;
+  -o-animation: pulse 2s ease-out 0s infinite;
+  -webkit-animation: pulse 2s ease-out 0s infinite;
+  animation: pulse 2s ease-out 0s infinite;
+}
+
+#loadingbar dt {
+opacity: .6;
+width: 180px;
+right: -80px;
+clip: rect(-6px,90px,14px,-6px);
+}
+
+#loadingbar dd {
+  opacity: .6;
+  width: 20px;
+  right: 0;
+  clip: rect(-6px,22px,14px,10px);
+}
+
+#loadingbar dd, #loadingbar dt {
+  position: absolute;
+  top: 0;
+  height: 2px;
+  -moz-box-shadow: #b91f1f 1px 0 6px 1px;
+  -ms-box-shadow: #b91f1f 1px 0 6px 1px;
+  -webkit-box-shadow: #B91F1F 1px 0 6px 1px;
+  box-shadow: #B91F1F 1px 0 6px 1px;
+  -moz-border-radius: 100%;
+  -webkit-border-radius: 100%;
+  border-radius: 100%;
+}
+
+#loadingbar.left dt {
+opacity: .6;
+width: 180px;
+left: -4px;
+clip: rect(-6px,185px,14px,25px);
+}
+
+#loadingbar.left dd {
+  opacity: .6;
+  width: 20px;
+  left: 0;
+  margin: 0;
+  clip: rect(-6px,22px,14px,0px);
+}
+
+#loadingbar.left dd, #loadingbar.left dt {
+  top: 0;
+  height: 2px;
+}
+
+#loadingbar.down dt {
+  opacity: .6;
+  height: 180px;
+  top: auto;
+  bottom: -47px;
+  clip: rect(-6px,20px,130px,-6px);
+}
+
+#loadingbar.down dd {
+  opacity: .6;
+  height: 20px;
+  top: auto;
+  bottom: 0;
+  clip: rect(-6px,22px,20px,10px);
+  margin: 0;
+}
+
+#loadingbar.down dd, #loadingbar.down dt {
+  left: -5px;
+  right: auto;
+  width: 10px;
+}
+
+#loadingbar.up dt {
+  opacity: .6;
+  height: 180px;
+  bottom: auto;
+  top: -10px;
+  clip: rect(13px,20px,190px,-6px);
+}
+
+#loadingbar.up dd {
+  opacity: .6;
+  height: 20px;
+  bottom: auto;
+  top: 0;
+  clip: rect(-6px,22px,25px,10px);
+  margin: 0;
+}
+
+#loadingbar.up dd, #loadingbar.up dt {
+  left: -5px;
+  right: auto;
+  width: 10px;
+}
+
+@keyframes pulse {
+  30% { opacity:0.6; }
+  60% { opacity:0; }
+  100% { opacity:0.6; }
+}
+
+@-moz-keyframes pulse 
+{
+  30% { opacity:0.6; }
+  60% { opacity:0; }
+  100% { opacity:0.6; }
+}
+
+@-ms-keyframes pulse 
+{
+  30% { opacity:0.6; }
+  60% { opacity:0; }
+  100% { opacity:0.6; }
+}
+
+@-webkit-keyframes pulse 
+{
+  30% { opacity:0.6; }
+  60% { opacity:0; }
+  100% { opacity:0.6; }
+}
--- a/fonts/MaterialIcons/MaterialIcons-Regular.ttf
+++ b/fonts/MaterialIcons/MaterialIcons-Regular.ttf
--- a/fonts/MaterialIcons/MaterialIcons-Regular.woff
+++ b/fonts/MaterialIcons/MaterialIcons-Regular.woff
--- a/fonts/MaterialIcons/MaterialIcons-Regular.woff2
+++ b/fonts/MaterialIcons/MaterialIcons-Regular.woff2
--- a/fonts/roboto/Roboto-Bold.eot
+++ b/fonts/roboto/Roboto-Bold.eot
--- a/fonts/roboto/Roboto-Bold.ttf
+++ b/fonts/roboto/Roboto-Bold.ttf
--- a/fonts/roboto/Roboto-Bold.woff
+++ b/fonts/roboto/Roboto-Bold.woff
--- a/fonts/roboto/Roboto-Bold.woff2
+++ b/fonts/roboto/Roboto-Bold.woff2
--- a/fonts/roboto/Roboto-Light.eot
+++ b/fonts/roboto/Roboto-Light.eot
--- a/fonts/roboto/Roboto-Light.ttf
+++ b/fonts/roboto/Roboto-Light.ttf
--- a/fonts/roboto/Roboto-Light.woff
+++ b/fonts/roboto/Roboto-Light.woff
--- a/fonts/roboto/Roboto-Light.woff2
+++ b/fonts/roboto/Roboto-Light.woff2
--- a/fonts/roboto/Roboto-Medium.eot
+++ b/fonts/roboto/Roboto-Medium.eot
--- a/fonts/roboto/Roboto-Medium.ttf
+++ b/fonts/roboto/Roboto-Medium.ttf
--- a/fonts/roboto/Roboto-Medium.woff
+++ b/fonts/roboto/Roboto-Medium.woff
--- a/fonts/roboto/Roboto-Medium.woff2
+++ b/fonts/roboto/Roboto-Medium.woff2
--- a/fonts/roboto/Roboto-Regular.eot
+++ b/fonts/roboto/Roboto-Regular.eot
--- a/fonts/roboto/Roboto-Regular.ttf
+++ b/fonts/roboto/Roboto-Regular.ttf
--- a/fonts/roboto/Roboto-Regular.woff
+++ b/fonts/roboto/Roboto-Regular.woff
--- a/fonts/roboto/Roboto-Regular.woff2
+++ b/fonts/roboto/Roboto-Regular.woff2
--- a/fonts/roboto/Roboto-Thin.eot
+++ b/fonts/roboto/Roboto-Thin.eot
--- a/fonts/roboto/Roboto-Thin.ttf
+++ b/fonts/roboto/Roboto-Thin.ttf
--- a/fonts/roboto/Roboto-Thin.woff
+++ b/fonts/roboto/Roboto-Thin.woff
--- a/fonts/roboto/Roboto-Thin.woff2
+++ b/fonts/roboto/Roboto-Thin.woff2
--- a/index.php
+++ b/index.php
@@ -0,0 +1,171 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="msapplication-tap-highlight" content="no" />
+  <!--Let browser know website is optimized for mobile-->
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>315权益知识答题</title>
+  <meta name="description" content="北京邮电大学学生会网络部网页答题" />
+  <meta name="author" content="flyto.cc/lenny" />
+  <!-- Favicons-->
+  <link rel="icon" href="p/bupt_logo.png" />
+  <!-- Import Google Icon Font -->
+  <link href="css/icon.css" rel="stylesheet" />
+  <!-- CSS-->
+  <!-- Compiled and minified CSS -->
+  <link rel="stylesheet" href="css/materialize.css" />
+  <!-- Import Jq CSS -->
+  <script src="js/jquery-2.1.4.min.js"></script>
+  <!-- IMPORT EXTRA JS/CSS -->
+  <!-- ####################################################### -->
+  <script src="js/form.js"></script>
+  <link rel="stylesheet" href="css/biankuang.css" />
+  <link rel="stylesheet" type="text/css" href="css/header.css">
+  <style type="text/css">
+      label {
+        width:100%
+      }
+  </style>
+  <!-- ####################################################### -->
+  <!-- END IMPORT EXTRA JS/CSS -->
+</head>
+
+<body>
+  <div style="box-sizing:content-box;font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Noto Sans CJK SC,WenQuanYi Micro Hei,Arial,sans-serif;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;" onclick="$('body,html').animate({scrollTop:0},500);">
+    <header class="Sticky AppHeader is-fixed" style="width:100%;top:0px;left:0px;">
+      <div class="AppHeader-inner" style="box-sizing:content-box;padding:0;width:100%;">
+        <nav role="navigation" style="height:60px;line-height:60px;">
+          <div class="nav-wrapper container">
+            <a id="logo-container" href="#" class="brand-logo" style="font-size:1.6rem;">
+              <img src="p/bupt_logo.png" alt="bupt" height="30px" style="vertical-align:middle;margin:0 10px 0 0;">315权益知识答题
+            </a>
+          </div>
+        </nav>
+      </div>
+      <div class="PageHeader">
+        <nav role="navigation" style="height:60px;">
+          <div class="nav-wrapper container">
+            <div style="text-align:center;display:inline-block;padding:5px 0;width:100%;float:left;">本次答题限时10分钟&nbsp;&nbsp;&nbsp;&nbsp;剩余时间&nbsp;&nbsp;<span name="remtime">10:00</span></div>
+          </div>
+        </nav>
+      </div>
+    </header>
+    <div class="progress" style="margin:0;position:fixed;top:60px;height:3px;z-index:999">
+      <div class="determinate" style="width:0%"></div>
+    </div>
+    <div class="Sticky--holder" style="position:relative;top:0px;right:0px;bottom:0px;left:0px;display:block;float:none;margin:0px;height:60.8px;visibility:hidden;font-size:15px;">
+    </div>
+  </div>
+  <main>
+    <div class="container">
+      <div class="row">
+        <form action="test.php" method="post" id="form1">
+          <div class="section" id="information" style="width:100%;">
+            <div class="input-field col s6">
+              <input id="user_name" type="text" class="validate" name="user_name" onblur="checkInfo(this,0);" value="">
+              <label for="user_name" id="user_name_label">姓名</label>
+            </div>
+            <div class="input-field col s6">
+              <input id="student_id" type="tel" class="validate" name="student_id" onblur="checkInfo(this,1);" value="">
+              <label for="student_id" id="student_id_label">学号</label>
+            </div>
+            <div class="input-field col s6">
+              <input id="school" name="school" type="text" class="validate" onblur="checkInfo(this,2);" value="">
+              <label for="school" id="school_label">学院</label>
+            </div>
+            <div class="input-field col s6">
+              <!--<select id="userclass" name="userclass" onchange="checkSexInfo(this)">
+                <option value="西土城" selected>西土城</option>
+                <option value="沙河">沙河</option>
+                <option value="宏福">宏福</option>
+              </select>
+              <label for="userclass" id="userclass_label">校区</label>
+              -->
+              <input id="userclass" name="userclass" type="text" class="validate" onblur="checkInfo(this,3);" value="">
+              <label for="userclass" id="userclass_label">校区</label>
+
+            </div>
+            <div class="input-field col s12">
+              <input id="telephone" name="telephone" type="tel" class="validate" onblur="checkInfo(this,4);" value="">
+              <label for="telephone" id="telephone_label">手机</label>
+            </div>
+          </div>
+          <div class="section" id="aboutTime" style="padding-top:0;width:100%;">
+            <!-- 倒计时器 -->
+            <div class="input-field col s12" style="height:1px;overflow:hidden">
+              <input value="<?php $timestart = date(" H:i:s ");echo $timestart;?>" type="text" class="validate" style="color:#fff" name="timestart">
+            </div>
+            <div style="text-align:center;display:inline-block;padding:5px 0;width:100%;float:left;">本次答题限时10分钟&nbsp;&nbsp;&nbsp;&nbsp;剩余时间&nbsp;&nbsp;<span name="remtime">10:00</span></div>
+          </div>
+          <div style="margin:0 auto;text-align:center;">
+            <div class="btn waves-effect waves-light" id="hiddenDisplay" onclick="requestFirst()">开始</div>
+          </div>
+          <?php
+            //link to mysql
+            $con=mysqli_connect("localhost","buptStudent","buptStudentlx","buptStudentdb");
+            if (!$con){die('Could not connect:' . mysql_error());};
+            //mysql_select_db("my_db_test", $con);
+            $p = 20;
+            $pp = 0;
+            $ppp = $p + $pp;//the number of questions
+            echo "<div id=\"ppp\" ppp=\"".$ppp."\"></div>\n<div class=\"section\" id=\"hiddenBefore\" style=\"display:none\"><h5>&nbsp;&nbsp;单选题</h5>\n";
+            //创建随机数组
+            $randomArray = array_rand(range(1,60),$p + 1);
+            shuffle($randomArray);
+            for($i = 1;$i <= $p;$i++){
+              $random = $randomArray[$i];
+              $result = mysqli_query($con,"SELECT * FROM Persons WHERE num='$random'");
+              while($row = mysqli_fetch_array($result)){
+              //html
+                echo "<div class=\"spbq\" name=\"div_e\"><div class=\"biankuang biankuang_1\"></div><div class=\"biankuang biankuang_2\"></div><div class=\"biankuang biankuang_3\"></div><div class=\"biankuang biankuang_4\"></div><h6 id=\"question_".$i."\">". $i. ".". $row['q'] ."</h6>\n<p><input class=\"with-gap\" type=\"radio\" name=\"answer_". $i. "\" value=\"1\" id=\"test". $i. "1\" onclick=\"addOne(this)\"/>\n<label for=\"test". $i. "1\">". $row['A'] ."</label>\n<input class=\"with-gap\" type=\"radio\" name=\"answer_". $i. "\" value=\"2\" id=\"test". $i. "2\" onclick=\"addOne(this)\"/>\n<label for=\"test". $i. "2\">". $row['B'] ."</label>\n<input class=\"with-gap\" type=\"radio\" name=\"answer_". $i. "\" value=\"3\" id=\"test". $i. "3\" onclick=\"addOne(this)\"/>\n<label for=\"test". $i. "3\">". $row['C'] ."</label>\n<input class=\"with-gap\" type=\"radio\" name=\"answer_". $i. "\" value=\"4\" id=\"test". $i. "4\" onclick=\"addOne(this)\"/>\n<label for=\"test". $i. "4\">". $row['D'] ."</label>\n</p></div>\n";
+                echo "<div class=\"input-field col s12\" style=\"height:1px;overflow:hidden\"><input value=\"".$random."\" type=\"text\" class=\"validate\" style=\"color:#fff\" name=\"question_".$i."\"></div>\n";
+              }
+            }
+
+            // echo "<!-- </div><div class=\"section\"> --><h5>&nbsp;&nbsp;二、判断题</h5>";
+            // $randomArray = range(1,10);
+            // shuffle($randomArray);
+            // for($i = 1;$i <= $pp;$i++){
+            //   $random = $randomArray[$i] + 60;
+            //   $result = mysqli_query($con,"SELECT q FROM Persons WHERE num='$random'");
+            //   while($row = mysqli_fetch_array($result)){
+            //     $j = $i + $p;
+            //     //echo "<p>".$row."</p>";
+            //     echo "<div class=\"spbq\" name=\"div_e\"><div class=\"biankuang biankuang_1\"></div><div class=\"biankuang biankuang_2\"></div><div class=\"biankuang biankuang_3\"></div><div class=\"biankuang biankuang_4\"></div><h6 id=\"question_".$j."\">". $j. ".". $row['q'] ."</h6>\n<p><input class=\"with-gap\" type=\"radio\" name=\"answer_". $j. "\" value=\"1\" id=\"test". $j. "1\" onclick=\"addOne(this)\"/>\n<label for=\"test". $j. "1\">正确</label>\n<input class=\"with-gap\" type=\"radio\" name=\"answer_". $j. "\" value=\"2\" id=\"test". $j. "2\" onclick=\"addOne(this)\"/>\n<label for=\"test". $j. "2\">错误</label>\n</p></div>\n";
+            //     echo "<div class=\"input-field col s12\" style=\"height:1px;overflow:hidden\"><input value=\"".$random."\" type=\"text\" class=\"validate\" style=\"color:#fff\" name=\"question_".$j."\"></div>\n";
+            //   }
+            // }
+
+            echo "</div>";
+            //close linking
+            mysqli_close($con);
+            ?>
+            <div style="margin:0 auto;text-align:center;">
+              <button class="btn waves-effect waves-light" type="submit" name="action" id="submit" style="display:none">提交</button>
+            </div>
+        </form>
+      </div>
+    </div>
+  </main>
+  <footer class="page-footer" style="padding-top:0;margin-top:30px;display: none;" id="theFooter">
+    <div class="footer-copyright" style="text-align:center;">
+      <div class="container">&copy;2018 Bupt-Web.
+        <a class="grey-text text-lighten-4" href="mailto:lenny.n@outlook.com">Mail Us</a>
+      </div>
+    </div>
+  </footer>
+  <!--  Scripts-->
+  <script src="js/materialize.js"></script>
+  <!-- Init JS -->
+  <script src="js/init.js"></script>
+  <!-- IMPORT EXTRA JS/CSS -->
+  <!-- ####################################################### -->
+  <script src="js/questionnaire.js"></script>
+  <!-- ####################################################### -->
+  <!-- END IMPORT EXTRA JS/CSS -->
+</body>
+
+</html>
--- a/js/form.js
+++ b/js/form.js
--- a/js/init.js
+++ b/js/init.js
@@ -0,0 +1,110 @@
+(function ($) {
+	'use strict';
+	$(function () {
+		// Plugin initialization
+		$('.scrollspy').scrollSpy();
+		$('.button-collapse').sideNav();
+		$('.materialboxed').materialbox();
+		$('select').material_select();
+
+		// Floating-Fixed table of contents
+		setTimeout(function () {
+			var tocWrapperHeight = 0,
+				/*Max height of ads.*/ tocHeight = $('.toc-wrapper .table-of-contents').length ? $('.toc-wrapper .table-of-contents').height() : 0,
+				socialHeight = $('nav').height(),
+				/*Height of unloaded social media in footer.*/ footerOffset = $('body>footer').first().length ? $('body>footer').first().offset().top : 0,
+				bottomOffset = footerOffset - socialHeight - tocHeight - tocWrapperHeight;
+			if ($('nav').length) {
+				$('.toc-wrapper').pushpin({
+					top: $('nav').height(),
+					width: $('.toc-wrapper').width(),
+					bottom: bottomOffset
+				});
+			} else if ($('#index-banner').length) {
+				$('.toc-wrapper').pushpin({
+					top: $('#index-banner').height(),
+					width: $('.toc-wrapper').width(),
+					bottom: bottomOffset
+				});
+			} else {
+				$('.toc-wrapper').pushpin({
+					top: 0,
+					width: $('.toc-wrapper').width(),
+					bottom: bottomOffset,
+				});
+			}
+		}, 100);
+
+	}); // end of document ready
+})(jQuery); // end of jQuery name space
+
+// Back to top & Header change
+$(document).ready(function ($, document, undefined) {
+
+	'use strict';
+
+	var offset = 300,
+		//browser window scroll (in pixels) after which the "back to top" link opacity is reduced
+		offset_opacity = 1100,
+		//duration of the top scrolling animation (in ms)
+		scroll_top_duration = 700,
+		//grab the "back to top" link
+		$back_to_top = $('.c-button'),
+
+		header_offset = 300,
+		//browser window scroll (in pixels) after which "heander change"
+		$header_hidden = $('.Sticky'),
+		$header_show = $(".PageHeader");
+
+	//hide or show the "back to top" link
+	$(window).scroll(function () {
+		if ($(this).scrollTop() > offset) {
+			$back_to_top.addClass('cd-is-visible');
+			$back_to_top.removeClass('cd-fade-out');
+		} else {
+			$back_to_top.removeClass('cd-is-visible cd-fade-out');
+		}
+		if ($(this).scrollTop() > offset_opacity) {
+			$back_to_top.addClass('cd-fade-out');
+		}
+		if ($(this).scrollTop() > header_offset) {
+			$header_hidden.addClass('is-hidden');
+			$header_show.addClass('is-shown');
+		} else {
+			$header_hidden.removeClass('is-hidden');
+			$header_show.removeClass('is-shown');
+		}
+	});
+
+	//button ripple effice
+	var $ripple = $('.js-ripple');
+
+	$ripple.on('click.ui.ripple', function (e) {
+
+		var $this = $(this);
+		var $offset = $this.parent().offset();
+		var $circle = $this.find('.c-ripple__circle');
+
+		var x = e.pageX - $offset.left;
+		var y = e.pageY - $offset.top;
+
+		$circle.css({
+			top: y + 'px',
+			left: x + 'px'
+		});
+
+		$this.addClass('is-active');
+
+		//smooth scroll to top
+		if ($(this).hasClass('backtotop')) {
+			e.preventDefault();
+			$('body,html').animate({
+				scrollTop: 0,
+			}, scroll_top_duration);
+		}
+	});
+
+	$ripple.on('animationend webkitAnimationEnd oanimationend MSAnimationEnd', function () {
+		$(this).removeClass('is-active');
+	});
+}); // end of back to top
--- a/js/jquery-2.1.4.min.js
+++ b/js/jquery-2.1.4.min.js
--- a/js/materialize.js
+++ b/js/materialize.js
--- a/js/questionnaire.js
+++ b/js/questionnaire.js
@@ -0,0 +1,253 @@
+//共占用3个变量名：myFun,addOne,checkedInfo
+var checkInfo, addOne;
+//////////////////////////////////////////////////////////////////////////////////////////
+(function(window) {
+    //倒计时
+    function remtime(timesec, clearT, fun) {
+        function countdown() {
+            function formatTime(sec) {
+                function fix(n) {
+                    if (n < 10) return "0" + n.toString();
+                    else return n;
+                    // return n<10?'0'+n.toString():n;
+                }
+                return fix(Math.floor(sec / 60)) + ":" + fix(sec % 60);
+            }
+
+            timesec--;
+            var timeTmp=formatTime(timesec);
+            for (var e_array = document.getElementsByName('remtime'), i = e_array.length - 1; i >= 0; i--) {
+                e_array[i].innerText = timeTmp;
+            }
+
+            if (!timesec) {
+                clearTimeout(timer);
+                $.isFunction(fun) && fun();
+            }
+            if (!clearT[0]) {
+                clearTimeout(timer);
+            }
+        }
+        var timer = setInterval(countdown, 1000);
+    }
+    //边框效果--移入
+    function borderShow(obj) {
+        var hh = $(obj).height() + 50,
+            ww = $(obj).width() + 50;
+        $(obj).find('.biankuang_1').stop(true).animate({
+            height: hh
+        }, 300);
+        $(obj).find('.biankuang_2').stop(true).delay(300).animate({
+            width: ww
+        }, 300);
+        $(obj).find('.biankuang_3').stop(true).animate({
+            height: hh
+        }, 300);
+        $(obj).find('.biankuang_4').stop(true).delay(300).animate({
+            width: ww
+        }, 300);
+    }
+    //边框效果--移出
+    function borderHidden(obj) {
+        $(obj).find('.biankuang_1').stop(true).delay(100).animate({
+            height: '0px'
+        }, 100);
+        $(obj).find('.biankuang_2').stop(true).animate({
+            width: '0px'
+        }, 100);
+        $(obj).find('.biankuang_3').stop(true).delay(100).animate({
+            height: '0px'
+        }, 100);
+        $(obj).find('.biankuang_4').stop(true).animate({
+            width: '0px'
+        }, 100);
+    }
+    window.myFun = [remtime, borderShow, borderHidden];
+})(window);
+//////////////////////////////////////////////////////////////////////////////////////////
+$(document).ready(function() {
+    var clearT = [1],
+        //正则匹配规则
+        theRegex = [
+            /^[\u4e00-\u9fa5]{2,5}$/,
+            /^((200|199)\d|201[0-7])\d{6}$/,
+            /^[\u4e00-\u9fa5]{2,}$/,
+            /^[\u4e00-\u9fa5]{2,}$/,
+            /^1\d{10}$/
+        ],
+        eName = [
+            "user_name",
+            "student_id",
+            "school",
+            "userclass",
+            "telephone"
+        ],
+        lableValue = new Array(),
+        questionNum,
+        questionsChecked = new Array();
+    //初始化 questionNum
+    questionNum = document.getElementById("ppp").getAttribute('ppp');
+    //初始化数组 labelValue & questionChecked
+    for (var i = eName.length - 1; i >= 0; i--) {
+        lableValue[i] = $("#" + eName[i] + "_label").html();
+    }
+
+    for (var i = questionNum - 1; i >= 0; i--) {
+        questionsChecked[i] = 0;
+    }
+    //倒计时器
+    //name="remtime"
+    //remtime(sec,callback);
+    startremtime=function(){
+        myFun[0](600, clearT,
+            function() {
+                var btn = document.getElementById("submit");
+                $("#form1").ajaxSubmit({
+                    beforeSubmit: function() {
+                        if (!clearT[0]) {
+                            return false;
+                        }
+                    },
+                    success: function(responseText) {
+                        clearT[0] = 0;
+                        alert("时间到！");
+                        alert(responseText);
+                    }
+                });
+                btn.setAttribute('class', btn.getAttribute('class') + ' disabled');
+        });
+    }
+
+    //当鼠标离开节点时调用此方法，验证节点内容是否符合注册规范
+    checkInfo = function(node, num) {
+        var label_id = "#" + eName[num] + "_label";
+        console.log(node.value);
+        if (!theRegex[num].test(node.value) && !node.value.length == 0) { //验证是否符合节点对应的正则表达式
+            $(node).css("box-shadow", "0 1px 0 0 red");
+            $(node).css("border-bottom", "1px solid red"); //不符合，相应内容变成红色
+            $(label_id).html("请填写正确的" + lableValue[num] + "！");
+            $(label_id).css("color", "red");
+        } else {
+            $(node).css("box-shadow", "0 1px 0 0 #26a69a");
+            $(node).css("border-bottom", "1px solid #26a69a"); //符合，相应内容变成绿色
+            $(label_id).html(lableValue[num]);
+            $(label_id).css("color", "#9e9e9e");
+        }
+    };
+
+    addOne = function(node) {
+        var sum = 0;
+        for (var i = questionNum; i > 0; i--) {
+            if ($(node).attr('name') == "answer_" + i) {
+                questionsChecked[i - 1] = 1;
+                break;
+            }
+        }
+        for (var i = questionNum - 1; i >= 0; i--) {
+            sum += questionsChecked[i];
+        }
+        $(".determinate").css("width", 100 * sum / questionNum + "%");
+    };
+
+    //表单验证
+    requestFirst = function() {
+        var ifblock = new Array(),
+            scroll_top_duration = 600; //ms
+        for (var i = eName.length - 1; i >= 0; i--) {
+            ifblock[i] = $.trim(document.getElementById(eName[i]).value);
+        }
+
+        //判断姓名和学好是否填写
+        for (var i = 0; i <= ifblock.length - 1; i++) {
+            if (ifblock[i].length == 0) {
+                Materialize.toast(lableValue[i] + '不能为空！', 4000);
+                $('body,html').animate({
+                    scrollTop: 0
+                }, 400);
+                return false;
+            } else if (!theRegex[i].test(ifblock[i])) {
+                Materialize.toast(lableValue[i] + '不正确！', 4000);
+                $('body,html').animate({
+                    scrollTop: 0
+                }, 400);
+                return false;
+            }
+        }
+        $("#information").hide();
+        $("#hiddenDisplay").hide();
+        $("#hiddenBefore").show();
+        $("#submit").show();
+        $("#theFooter").show();
+        startremtime();
+        return true;
+    }
+
+    function showRequest() {
+        var ifblock = new Array(),
+            scroll_top_duration = 600; //ms
+        for (var i = eName.length - 1; i >= 0; i--) {
+            ifblock[i] = $.trim(document.getElementById(eName[i]).value);
+        }
+
+        //判断姓名和学好是否填写
+        for (var i = 0; i <= ifblock.length - 1; i++) {
+            if (ifblock[i].length == 0) {
+                Materialize.toast(lableValue[i] + '不能为空！', 4000);
+                $('body,html').animate({
+                    scrollTop: 0
+                }, 400);
+                return false;
+            } else if (!theRegex[i].test(ifblock[i])) {
+                Materialize.toast(lableValue[i] + '不正确！', 4000);
+                $('body,html').animate({
+                    scrollTop: 0
+                }, 400);
+                return false;
+            }
+        }
+        //判断题目是非选择
+        for (var i = 1; i <= questionNum; i++) {
+            var answerno = "answer_" + i, //遍历每到题目
+                isAutoSend = document.getElementsByName(answerno),
+                nochecked = 0;
+            for (var x = 0; x < isAutoSend.length; x++) {
+                if (isAutoSend[x].checked) {
+                    nochecked = 1;
+                    break;
+                }
+            }
+            if (nochecked == 0) {
+                var question = "question_" + i,
+                    obj = document.getElementsByName("div_e")[i - 1];
+                Materialize.toast("第" + i + "题未选择", 3000);
+                $('body,html').animate({
+                        scrollTop: $(document.getElementById(question)).offset().top - 75
+                    }, scroll_top_duration,
+                    function() {
+                        myFun[1](obj);
+                        setTimeout(function() { myFun[2](obj) }, 1200);
+                    }
+                );
+                return false;
+            }
+        }
+        //alert("提交成功。谢谢参与我们的活动，请继续关注我们公众号bupt_stu的后续推送。现在你可以直接关闭页面了。"); //Alert("post success.");
+        if (!clearT[0]) {
+            return false;
+        }
+        return true;
+    }
+
+    function showResponse(responseText) {
+        clearT[0] = 0;
+        alert(responseText);
+        window.location.href="https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=MjM5NzY1MjYyMg==&scene=124#wechat_redirect";
+
+    }
+    var options = {
+        beforeSubmit: showRequest,
+        success: showResponse
+    };
+
+    $("#form1").ajaxForm(options);
+});
--- a/test.php
+++ b/test.php
@@ -0,0 +1,73 @@
+<?php
+	header("Content-Type: text/html;charset=utf-8");
+    $userIp = $_SERVER["REMOTE_ADDR"];
+    $timeend = date("H:i:s");
+    //时间差
+    $sec = strtotime($timeend)-strtotime($_POST[timestart]);
+    $m = floor($sec/60);
+    $s = floor($sec%60);
+    //link to mysql
+    $con = mysqli_connect("localhost","buptStudent","buptStudentlx","buptStudentdb");
+    if (!$con){die('Could not connect: '.mysql_error());}
+    mysql_select_db("my_db_test", $con);
+    //name & student_id
+    $chongfu="SELECT Student_ID FROM UserAnswer WHERE Student_ID=$_POST[student_id]";
+    if(mysql_fetch_array(mysql_query($chongfu,$con))[0]==$_POST[student_id])
+    {
+      die('对不起，您已参与过本活动。');
+    }
+    $sql="INSERT IGNORE INTO UserAnswer (user_name, Student_ID, school, userclass, phone, ip, timeend ,timestart, thetime)
+    VALUES
+    ('$_POST[user_name]','$_POST[student_id]','$_POST[school]','$_POST[userclass]','$_POST[telephone]','$userIp','$timeend','$_POST[timestart]','$sec')";
+    if (!mysql_query($sql,$con))
+    {
+      die("提交失败，请稍后重试。");
+    }
+    //echo "your name is <strong>".$_POST[user_name]."</strong> and student_id is <strong>".$_POST[student_id]."</strong> .<br />your ip is ".$userIp."<br />开始时间 ".$_POST[timestart]." 结束时间 ".$timeend." 用时 ".$m."分".$s."秒<br />";
+    //answer_
+    $qn=50;
+    for($i=1;$i<=$qn;$i++){
+    $a = "answer_".$i;
+    //$sql = "UPDATE UserAnswer SET $a=$_POST[$a] WHERE Student_ID=$_POST[student_id]";
+    //if (!mysql_query($sql,$con))
+    //  {
+    //    $sql2="ALTER TABLE UserAnswer ADD $a INT(11) NOT NULL";
+    //    mysql_query($sql2,$con);
+    //    mysql_query($sql,$con);
+    //  }
+    $b= "question_".$i;
+    //$sql3 = "UPDATE UserAnswer SET $b=$_POST[$b] WHERE Student_ID=$_POST[student_id]";
+    //if (!mysql_query($sql3,$con))
+    //  {
+    //    $sql4="ALTER TABLE UserAnswer ADD $b INT(11) NOT NULL";
+    //    mysql_query($sql4,$con);
+    //    mysql_query($sql3,$con);
+    //  }
+    $c= "aq_".$i;
+	$d=$_POST[$a]+$_POST[$b]*10;
+    $sql5 = "UPDATE UserAnswer SET $c=$d WHERE Student_ID=$_POST[student_id]";
+    if (!mysql_query($sql5,$con))
+      {
+        $sql6="ALTER TABLE UserAnswer ADD $c INT(11) NOT NULL";
+        mysql_query($sql6,$con);
+        mysql_query($sql5,$con);
+      }
+    };
+    //match & score
+    //$result = mysql_query("SELECT * FROM UserAnswer WHERE Student_ID=$_POST[student_id]");
+    //$row = mysql_fetch_array($result);
+    //$g=0;
+    //for($i=1;$i<=$qn;$i++){
+    //  $b="answer_".$i;
+    //  $c=$row[$b];
+    //  $d=mysql_query("SELECT answer FROM Persons WHERE num=$i");
+    //  $e=mysql_fetch_array($d)['answer'];
+      //$d=$answer_row[$b];
+    //  if($c==$e) $g++;
+      //echo "No.".$i." your choice is ".$c." answer is ".$e."<br />";
+    //};
+    //echo "每题一分： your score is ".$g."<br />";
+    echo "提交成功。谢谢参与我们的活动，请继续关注我们公众号bupt_stu的后续推送。现在你可以直接关闭页面了。";
+    //close linking
+    mysql_close($con);
+?>