master

分支 (1)

管理

管理

master

jilin__hzs
/
test.html

<!DOCTYPE html>
<html>

	<head lang="en">
		<meta charset="UTF-8">
		<title>航班查询</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="iconfont/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="css/all_css.css" />
		<link rel="stylesheet" type="text/css" href="css/weui/base.css" />
		<link rel="stylesheet" type="text/css" href="lib/weui.css" />
		<link rel="stylesheet" type="text/css" href="css/weui/jquery-weui.css" />
		<link rel="stylesheet" type="text/css" href="css/test.css" />
	</head>

	<body ontouchstart>
		<div id="AirportSearch_main">
			<div class="test_head" id="firTitle">
				<div class="app_head_left">
					<a class="iconfont" id="returnPrevBtn">&#xe6d4;</a>
				</div>
				<div class="app_head_mid">
					<p id="app_head_title">航班查询</p>
				</div>
			</div>
			<!--航班查询内容-->
			<div class="content" id="air_mid_main">

				<div class="weui_tab">
					<!--选择步行公交自驾按钮区域-->
					<div class="weui_navbar">
						<a href="#airNum" class="weui_navbar_item weui_bar_item_on chooseAirNum noRepeat" onclick="chooseTB_Col(this)">
							<b class="ml20">单程</b>
						</a>
						<a href="#mySearch" class="weui_navbar_item chooseMy noRepeat" onclick="chooseTB_Col(this)">
							<b class="ml20">往返</b>
						</a>
					</div>
					<div class="weui_tab_bd">
						<div class="top_null"></div>
						<div class="s-flight-content">
							<ul>
								<li>
									<span>出发城市</span>
									<input onpaste="return false;" type="text" maxlength="11" name="" id="fromCity" placeholder="请输入国内·国际城市" />
								</li>
								<li>
									<span>到达城市</span>
									<input onpaste="return false;" type="text" maxlength="11" type="" name="" id="toCity" placeholder="请输入国内·国际城市" />
								</li>
								<li class="borderNo" id="goDateLi">
									<span>出发日期</span>
									<input type="" name="" id="airDataVal" placeholder="请选择日期" data-toggle='date' />
								</li>
								<li style="display: none;" class="borderNo" id="backDateLi">
									<span>返程日期</span>
									<input type="" name="" id="backDateVal" placeholder="请选择日期" />
								</li>
							</ul>
							<div class="query" id="mySearchBtn">查询</div>
						</div>
					</div>
				</div>
			</div>
			<iframe id="iframeResult" width="100%" style="display: none;">

			</iframe>
		</div>
		<script src="js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/weui/jquery-weui.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			function chooseTB_Col(t) {
				if(t.children[0].innerHTML == "往返") {
					$(".chooseAirNum").css("background-image", "url(img/img/images/Icon_whiteAir.png)");
					$(".chooseMy").css("background-image", "url(img/img/images/Icon_blueS.png)");
					$("#backDateLi").show();
					$("#goDateLi span").html("去程日期");
					$("#goDateLi").removeClass("borderNo");
				} else if(t.children[0].innerHTML == "单程") {
					$(".chooseAirNum").css("background-image", "url(img/img/images/Icon_blueAir.png)");
					$(".chooseMy").css("background-image", "url(img/img/images/Icon_whiteS.png)");
					$("#backDateLi").hide();
					$("#goDateLi span").html("出发日期");
					$("#goDateLi").addClass("borderNo");
				}
			}
			//计算出发日期可选择的最大日期和最小日期（提前三个月可购买机票）
			var myDate = new Date();
			var y = myDate.getFullYear();
			var m = myDate.getMonth() + 1;
			var d = myDate.getDate();
			var todayDate = y + "-" + m + "-" + d;
			var minBack = $("#airDataVal").val();
			myDate.setDate(myDate.getDate() + 90);
			var maxD = myDate.getFullYear() + "-" + (myDate.getMonth() + 1) + "-" + myDate.getDate();
			//初始化日历组件去程日期
			$("#airDataVal").calendar({
				minDate: todayDate,
				maxDate: maxD
			});
			//初始化日历组件返程日期
			$("#backDateVal").click(function() {
				console.log($("#airDataVal").val());
				//						console.log(todayDate);
			});
			$("#backDateVal").calendar({
				minDate: todayDate,
				maxDate: maxD
			});

			//^[/u4E00-/u9FA5]+$
			//验证出发和到达两个输入框输入内容
			$("#fromCity,#toCity").keyup(function(){
				var val = $(this).val();
				var reg = /^[\u4E00-\u9FA5]+$/;
				if(!reg.test(val)){
					$("#fromCity,#toCity").val("");
				}
			});

			$("#mySearchBtn").click(function() {
				var goDayStr = parseInt($("#airDataVal").val().replace(/-/g, ""));
				var backDayStr = parseInt($("#backDateVal").val().replace(/-/g, ""));
				var fromC = $("#fromCity").val();
				var toC = $("#toCity").val();
				if(fromC == "" || toC == "") {
					$.alert("请输入您的起点和目的地", "提示");
				} else if(fromC == toC) {
					$.alert("起点和终点不能一致！", "输入有误");
				} else {
					if($("#airDataVal").val() == "") {
						$.alert("请选择您的出发日期", "提示");
					} else if(backDayStr <= goDayStr) {
						$.alert("去程日期应早于返程", "提示");
						$("#airDataVal").val("");
						$("#backDateVal").val("");
					} else {
						$("#air_mid_main").hide();
						$("#firTitle").removeClass("head_jBcol");
						//iframe外部
						document.getElementById("iframeResult").style.display = "block";
						var allHeight = document.documentElement.clientHeight;
						$("#iframeResult").height(allHeight - 29);
						//iframe内部
						$("#app_head_title").html(fromC + "<img class='changjiantou' src='img/railway/changjiantou.png' />" + toC);
						$("#iframeResult").attr("src", "https://m.flight.qunar.com/ncs/page/flightlist?depCity=" + fromC + "&arrCity=" + toC + "&goDate=" + $("#airDataVal").val() + "&backDate=" + $("#backDateVal").val() + "&sort=&airLine=&from=");
					}
				}
			});
			$("#returnPrevBtn").click(function() {
				if(document.getElementById("iframeResult").style.display == "none") {
					window.location.href = "javascript:history.go(-1)";
				} else {
					document.getElementById("iframeResult").style.display = "none";
					$("#air_mid_main").show();
					$("#app_head_title").html("航班查询");
				}
			});
		</script>
	</body>

</html>