<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="School.aspx.cs" Inherits="Quiz.WebSite.School" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8">
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<title>绍兴市柯桥区教育满意度调查</title>
<link href="http://vote.on168.com.cn/jindu/assets/reset.css" rel="stylesheet"/>
<link href="http://vote.on168.com.cn/jindu/assets/style.css" rel="stylesheet"/>
<script src="http://vote.on168.com.cn/jindu/assets/jquery-1.8.3.min.js"></script>
<style>
html{ width:100%; overflow-x:hidden;}
.footer{ margin-top:70px; padding:10px 0;}
.footer.absolute-bottom{ margin-top:0;}
</style>
<link href="http://vote.on168.com.cn/jindu/assets/select2/select2.min.css" rel="stylesheet" />
<style>
.select2-container{ margin-bottom:15px;}
.select2-results__option{ padding:12px 6px;}
.select2-results__option:hover{ background:#eee;}
.select2-container--default .select2-search--dropdown .select2-search__field{ -webkit-appearance:none; border:1px solid #ddd; border-radius:2px; padding:8px 4px; font-size:14px;}
.select2-container--open .select2-dropdown--above{ border-bottom:1px solid #ccc; box-shadow:0 -2px 3px rgba(0,0,0,.2)}
.select2-container--open .select2-dropdown--below{ border-top:1px solid #ccc; box-shadow:0 2px 3px rgba(0,0,0,.2)}
.select2-container--default .select2-selection--single{ border:0; height:40px;}
.select2-container--default .select2-selection--single .select2-selection__rendered{ line-height:40px;}
.select2-container--default .select2-selection--single .select2-selection__arrow{ height:40px;}
.select2-dropdown{ border:0; background:rgba(255,255,255,.9)}
.header{ position:absolute;}
.tips{ display:none; position:absolute; min-width:50px; max-width:200px; min-height:20px; line-height:20px; padding:8px 10px; background:rgba(255,0,0,.9); color:#fff; border-radius:5px; top:100px; left:50px; z-index:100;}
.tips:before{ content:""; border:6px solid Transparent; border-bottom-color:rgba(255,0,0,.9); position:absolute; top:-12px; left:10px;}
.tips .fa{ margin-right:5px;}
</style>
<script src="http://vote.on168.com.cn/jindu/assets/select2/select2.min.js"></script>
<script src="http://vote.on168.com.cn/jindu/assets/select2/i18n/zh-CN.js"></script>
<script>
$(function(){
});
</script>
</head>
<body class="bodybg">
<header class="header">
<a class="back" onclick="history.back()"></a>
<div class="mid">绍兴市柯桥区教育满意度调查</div>
</header>
<section class="h-header"></section>
<section class="tips"></section>
<section class="school-wrap">
<div class="swiper-container">
<div class="swiper-wrapper">
<%--<div class="swiper-slide slide-0">
<article class="circle">
<div class="form">
<h3 class="form-t"><i class="fa fa-user-plus"></i>选择身份</h3>
<a class="a-student">我是 学生家长</a>
<a class="a-people">我是 热心市民</a>
</div>
</article>
<section class="footer">
<img src="http://vote.on168.com.cn/jindu/images/copyright.gif" /> 杭州顺治科技股份有限公司
<br />客服热线：<a>400-826-2468</a>
</section>
</div>--%>
<div class="swiper-slide slide-1">
<article class="circle">
<div class="form">
<h3 class="form-t"><i class="fa fa-mobile-phone"></i>验证手机号码
</h3>
<input class="input-1 input-phone" id="mobile" type="tel" placeholder="手机号码"/>
<div class="verbox clearfix">
<input class="input-1" id="ver" placeholder="4位验证码" type="tel"/>
<span class="btn-send">获取验证码</span>
</div>
<input type="hidden" id="code" />
<input class="input-submit" type="button" value="开始答题" onclick="return check1()"/>
</div>
</article>
<section class="footer">
<img src="http://vote.on168.com.cn/jindu/images/copyright.gif"/> 杭州顺治科技股份有限公司
<br/>客服热线：<a>400-826-2468</a>
</section>
</div>
<%--<div class="swiper-slide slide-2">
<article class="circle">
<div class="form">
<select id="select1">
<option value="0">幼儿园</option>
<option value="1">小学</option>
<option value="2">中学</option>
</select>
<select id="select2">
</select>
<input class="input-1 input-phone" id="mobile1" type="tel" placeholder="手机号码"/>
<input class="input-1 input-name" type="text" id="peoplename" placeholder="姓名（选填）"/>
<input class="input-submit" type="button" value="开始答题" onclick="return check2();" />
</div>
</article>
<section class="footer">
<img src="http://vote.on168.com.cn/jindu/images/copyright.gif"/> 杭州顺治科技股份有限公司
<br/>客服热线：<a>400-826-2468</a>
</section>
</div>--%>
</div>
</div>
</section>
<!--swiper-->
<link href="http://vote.on168.com.cn/jindu/assets/swiper/swiper.min.css" rel="stylesheet"/>
<script src="http://vote.on168.com.cn/jindu/assets/swiper/swiper.min.js"></script>
<script>
var swiper;
$(function(){
var $swiperContainer=$('.swiper-container');
var $swiperSlide=$('.swiper-container .swiper-slide');
swiper = new Swiper('.swiper-container',{
allowSwipeToPrev:false,
allowSwipeToNext:false,
speed:500
});
})
</script>
<!--swiper End-->
<!--获取学校数据 start-->
<script>
$.ajax({
url: "Ajax/GetSchool",
data: {
schooltype: 0
},
type: 'get',
cache: true,
async: true,
dataType: 'json',
success: function (json) {
$('#select2').empty();
$('#select2').append("<option value='0'>选择学校</option>");
for(var i=0;i<json.Data.length;i++)
{
$('#select2').append("<option value='" + json.Data[i].SchoolName + "'>" + json.Data[i].SchoolName + "</option>");
}
}
});
$('#select1').change(function() {
$.ajax({
url: "Ajax/GetSchool",
data: {
schooltype: $(this).val()
},
type: 'get',
cache: true,
async: true,
dataType: 'json',
success: function(json) {
$('#select2').empty();
$('#select2').append("<option value='0'>选择学校</option>");
for (var i = 0; i < json.Data.length; i++) {
$('#select2').append("<option value='" + json.Data[i].SchoolName + "'>" + json.Data[i].SchoolName + "</option>");
}
}
});
});
</script>
<!--获取学校数据 End-->
<!--提示框-->
<link href="http://vote.on168.com.cn/jindu/assets/AlerStatus/AlerStatus.css" rel="stylesheet"/>
<script src="http://vote.on168.com.cn/jindu/assets/AlerStatus/AlerStatus.js"></script>
<script>
var winHeight = $(window).height();
var winWidth = $(window).width();
$(function(){
var bodyWidth = $('body').width();
//footer
if (winHeight <= 480||winHeight<=winWidth* 1.5) {
$('.footer').addClass('absolute-bottom');
};
//点击获取验证码
$('.btn-send').on('touchend',function(){
//判断是否填入手机
var mobile = $('#mobile').val();
if (!mobile) {
showTips($('#mobile'), '请填入手机号', 'error');
return false;
} else {
var reg = /^0?1[3|4|5|7|8][0-9]\d{8}$/;
if (!reg.test(mobile)) {
showTips($('#mobile'), '手机号码填写有误', 'error');
return false;
}
}
var myDate2 = new Date();
var thisdate = myDate2.getTime();
var localTime = parseInt(localStorage.getItem("curTime"));
console.log(typeof(thisdate));
console.log(typeof(parseInt(localTime)));
console.log((thisdate - localTime)/1000-30);
if (localTime != "underfined" && localTime != "" && ((thisdate - localTime) / 1000 - 30) <= 60) {
return false;
}
var $this = $(this);
var myDate = new Date();
var curTime = myDate.getTime();
localStorage.setItem("curTime", curTime);
//发送验证码
$.post("Ajax/SendMsgCode", { mobile: mobile }, function(json) {
if (json.Status==1) {
$('#code').val(json.Data);
//发送验证码
if (!$this.hasClass('hasSend')) {
$this.addClass('hasSend').text('60s');
var _tick = 60;
var _tickFn = setInterval(function() {
_tick--;
$this.text(_tick + 's');
if (_tick == 0) {
clearInterval(_tickFn);
setTimeout(function() {
$this.removeClass('hasSend').text('发送验证码');
}, 1000);
}
}, 1000);
}
}else if (json.Status == 3) {
$.AlerStatus({
status: 'error', //状态
msg: json.Message, //文字0
duration: 2000
});
setTimeout(function() {
location.href = "Thanks.html?mobile=" + mobile;
}, 2000);
}
else {
$.AlerStatus({
status: 'error', //状态
msg: json.Message, //文字0
duration: 2000
});
}
},'json');
});
//选择身份
//点击学生家长
$('.slide-0 .a-student').on('click',function(){
swiper.slideNext();
});
//点击热心市民
$('.slide-0 .a-people').on('click',function(){
swiper.slideTo(2);
});
});
//发送完验证码后，点击下一步
function check1(){
//判断是否填入手机
var mobile = $('#mobile').val();
if (!mobile) {
showTips($('#mobile'), '请填入手机号', 'error');
return false;
}
//判断是否填入验证码
var ver=$('#ver').val();
if (!ver) {
showTips($('#ver'), '请填入验证码', 'error');
return false;
}
/*
*需检查验证码
*/
var code = $('#code').val();
if (ver == code) {
//去后台判断是否符合要求，是否已经答过题
$.post("Ajax/CheckCode", { mobile: mobile,usertype:0 }, function (json) {
//符合要求，进入答题页面
if (json.Status == 1) {
//手机号码存入本地
localStorage.setItem('mobile', mobile);
localStorage.setItem('name', json.Data);
localStorage.setItem('schoolname', json.Message);
location.href = "Question.html?userType=0";
}else if (json.Status == 3) { //已经答过题了，跳转到页面
location.href = "Thanks.html?mobile="+mobile;
} else {
$.AlerStatus({
status: 'error', //状态
msg: json.Message, //文字0
duration: 2000
});
}
}, 'json');
} else {
$.AlerStatus({
status: 'error', //状态
msg: "输入验证码错误", //文字0
duration: 2000
});
}
};
//判断普通市民
function check2() {
//判断是否填入手机
var mobile = $('#mobile1').val();
if (!mobile) {
showTips($('#mobile1'), '请填入手机号', 'error');
return false;
}
var schoolname = $('#select2').val();
var peoplename = $('#peoplename').val();
if (schoolname == "0") {
showTips($('#select2'), '请选择学校', 'error');
return false;
}
//去后台判断是否符合要求，是否已经答过题
$.post("Ajax/CheckCode", { mobile: mobile,usertype:1 }, function (json) {
//符合要求，进入答题页面
if (json.Status == 1) {
//手机号码存入本地
localStorage.setItem('mobile', mobile);
localStorage.setItem('name', peoplename);
localStorage.setItem('schoolname', schoolname);
location.href = "Question.html?userType=1";
} else if (json.Status == 3) { //已经答过题了，跳转到页面
location.href = "Thanks.html?mobile="+mobile;
} else {
$.AlerStatus({
status: 'error', //状态
msg: json.Message, //文字0
duration: 2000
});
}
}, 'json');
}
/*表单提示*/
var $tips=$('.tips');
var tipsLeft,tipsTop;//表单错误提示位置
function showTips(e,text,status,duration){
tipsLeft=e.offset().left;
tipsTop=e.offset().top+46;
var backgroundColor;
if(status=="error"){
$('.checkerror').removeClass('checkerror');
if(e.is('select')){
e.next().find('.select2-selection').addClass('checkerror');
}else{
e.addClass('checkerror');
}
}
backgroundColor="rgba(255,0,0,.9)";
$tips.html('<i class="fa fa-exclamation-circle"></i>'+text).css({'background-color':backgroundColor,'left':tipsLeft,'top':tipsTop}).fadeIn(300);
$('body').animate({'scrollTop':tipsTop-100},500);
hideTips(duration);
//改变后如果有值，则隐藏tips
e.change(function(){
if(e.val()){
if(e.val()==3&&e.hasClass('select-grade')){
}else{
hideTips(0);
}
}
})
}
/*隐藏表单提示--usage：
*一直存在： hideTips();
*马上隐藏: hideTips(0);
*2秒后隐藏: hideTips(2000);
*/
function hideTips(duration){
if(typeof(duration)!="undefined"){
//如果有持续时间，则在duration后隐藏
setTimeout(function(){
$tips.fadeOut(300);
$('.checkerror').removeClass('checkerror');
},duration);
}
}
</script>
<div style="display:none;">
<!-- #include file="cs.aspx" -->
<img src="<%= new CS("1259782995").TrackPageView()%>" width="0" height="0"/>
</div>
</body>
</html>