-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
138 lines (132 loc) · 9.36 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.title{
text-align: center;
}
.container{
margin:0 auto;
padding-top: 30px;
}
li{
list-style:none ;
}
</style>
<link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.kuaidi100.com/css/sz/base_v4.css?version=201807261600" />
<link rel="stylesheet" href="https://cdn.kuaidi100.com/css/sz/query_v4.css?version=201805291550" />
<link rel="stylesheet" href="https://cdn.kuaidi100.com/css/sz/index_v4.css?version=201807121110" />
<script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div>
<h4 class="title">快递单号查询</h4>
<hr>
<form class="">
<div class="form-group">
<input type="text" class="form-control" id="name" placeholder="选择快递公司名称" readonly>
<div id="comList" class="select-box hidden" style="display: block;">
<div class="com-list">
<div id="suggestList" class="suggest hidden" style="display: block;"><span class="li-title">推荐</span><a data-code="youshuwuliu" data-num="12121212">优速</a><a data-code="guotongkuaidi" data-num="12121212">国通</a><a data-code="rufengda" data-num="12121212">如风达</a><a data-code="annengwuliu" data-num="12121212">安能</a><a data-code="quanfengkuaidi" data-num="12121212">全峰</a></div>
<ul class="common">
<li><span class="li-title">常用</span><a data-code="default">智能识别</a><a data-code="shunfeng">顺丰</a><a data-code="ems">EMS</a><a data-code="youzhengguonei">邮政包裹</a><a data-code="huitongkuaidi">百世汇通</a><a data-code="shentong">申通</a><a data-code="zhongtong">中通</a><a data-code="yuantong">圆通</a><a data-code="guotongkuaidi">国通</a><a data-code="yunda">韵达</a><a data-code="tiantian">天天</a><a data-code="youshuwuliu">优速</a><a data-code="kuaijiesudi">快捷</a><a data-code="quanfengkuaidi">全峰</a><a data-code="jd">京东</a><a data-code="zhaijisong">宅急送</a></li>
</ul>
<ul class="all-list fl">
<li><span class="li-title">A</span><a data-code="annengwuliu">安能物流</a><a data-code="aae">AAE</a><a data-code="aramex">Aramex</a></li>
<li class="dl-bg"><span class="li-title">B</span><a data-code="baishiwuliu">百世快运</a><a data-code="youzhengguonei">包裹/平邮</a><a data-code="bangsongwuliu">邦送物流</a></li>
<li><span class="li-title">C</span><a data-code="coe">COE</a><a data-code="flyway">程光快递</a><a data-code="chuanxiwuliu">传喜物流</a></li>
<li class="dl-bg"><span class="li-title">D</span><a data-code="dhl">DHL</a><a data-code="debangwuliu">德邦物流</a><a data-code="disifang">递四方</a></li>
<li><span class="li-title">E</span><a data-code="emsguoji">EMS国际件</a><a data-code="ewe">EWE</a></li>
<li class="dl-bg"><span class="li-title">F</span><a data-code="fedex">FedEx</a><a data-code="chronopostfren">法国邮政</a></li>
<li><span class="li-title">G</span><a data-code="youzhengguonei">挂号信</a><a data-code="guotongkuaidi">国通快递</a></li>
<li class="dl-bg"><span class="li-title">H</span><a data-code="koreapost">韩国邮政</a><a data-code="postnl">荷兰邮政</a></li>
</ul>
<ul class="all-list fl">
<li><span class="li-title">J</span><a data-code="jiajiwuliu">佳吉快运</a><a data-code="jinguangsudikuaijian">京广快递</a><a data-code="jiayiwuliu">佳怡物流</a></li>
<li class="dl-bg"><span class="li-title">K</span><a data-code="kuaijiesudi">快捷速递</a><a data-code="kuayue">跨越速运</a><a data-code="hrvatska">克罗地亚邮政</a></li>
<li><span class="li-title">L</span><a data-code="longbanwuliu">龙邦快运</a><a data-code="lianbangkuaidi">联邦快递</a><a data-code="lianhaowuliu">联昊通</a></li>
<li class="dl-bg"><span class="li-title">M</span><a data-code="usps">美国邮政</a><a data-code="minghangkuaidi">民航快递</a><a data-code="mexico">墨西哥邮政</a></li>
<li><span class="li-title">N</span><a data-code="ganzhongnengda">能达速递</a><a data-code="postennorge">挪威邮政</a><a data-code="southafrican">南非邮政</a></li>
<li class="dl-bg"><span class="li-title">O</span><a data-code="ocs">OCS</a><a data-code="ontrac">OnTrac</a></li>
<li><span class="li-title">P</span><a data-code="portugalctt">葡萄牙邮政</a><a data-code="swisspost">瑞士邮政</a></li>
<li class="dl-bg"><span class="li-title">Q</span><a data-code="quanfengkuaidi">全峰快递</a><a data-code="quanyikuaidi">全一快递</a><a data-code="quanchenkuaidi">全晨快递</a></li>
</ul>
<ul class="all-list fl">
<li><span class="li-title">R</span><a data-code="rrs">日日顺物流</a><a data-code="rufengda">如风达</a><a data-code="japanposten">日本邮政</a></li>
<li class="dl-bg"><span class="li-title">S</span><a data-code="suer">速尔快递</a><a data-code="shenghuiwuliu">盛辉物流</a></li>
<li><span class="li-title">T</span><a data-code="tnt">TNT</a><a data-code="tiandihuayu">天地华宇</a><a data-code="thailand">泰国邮政</a></li>
<li class="dl-bg"><span class="li-title">U</span><a data-code="usps">USPS</a><a data-code="ups">UPS</a></li>
<li><span class="li-title">W</span><a data-code="wanxiangwuliu">万象物流</a><a data-code="wanjiawuliu">万家物流</a><a data-code="ukrpost">乌克兰邮政</a></li>
<li class="dl-bg"><span class="li-title">X</span><a data-code="xinbangwuliu">新邦物流</a><a data-code="xinfengwuliu">信丰物流</a><a data-code="hkpost">中国香港邮政</a></li>
<li><span class="li-title">Y</span><a data-code="youzhengguonei">邮政国内</a><a data-code="youzhengguoji">邮政国际</a><a data-code="youshuwuliu">优速快递</a></li>
<li class="dl-bg"><span class="li-title">Z</span><a data-code="zhongyouwuliu">中邮物流</a><a data-code="ztky">中铁物流</a><a data-code="zhongtiewuliu">中铁快运</a></li>
</ul>
<div class="box"></div>
<div class="other"><a href="javascript:;">查看更多快递公司>></a></div>
</div>
</div>
</div>
<div class="form-group">
<input type="text" class="form-control" id="postid" placeholder="请输入快递单号">
</div>
<div class="form-group">
<button type="button" id="submit" class="btn btn-primary">提交</button>
</div>
</form>
</div>
<div class="content">
<table class="result-info" cellspacing="0">
<tbody></tbody>
</table>
</div>
</div>
<script>
$('#name').focus(function () {
console.log('222')
$('#comList').removeClass('hidden')
});
$('#comList a').click(function(){
if($(this).attr('data-code')){
$('#name').val($(this).text());
$('#name').attr('code',$(this).attr('data-code'));
$('#comList').addClass('hidden')
}
});
$('#submit').click(function(){
var type = $('#name').attr('code');
var postId = $('#postid').val();
var url = 'http://localhost:5000'
$.ajax({
url:url,
dataType:'json',
data:{
type:type,
postid:postId},
success:function(res){
var str = '';
console.log(res.data)
console.log(typeof res.data)
if(res.data.length>0){
var data = res.data;
for(var i=0;i<data.length;i++){
str+='<tr class="last"><td class="row1"><span class="day">'+data[i].time+'</span> </td><td class="status status-check"> <div class="col2"><span class="step"><span class="line1"></span><span class="line2"></span></span></div></td><td class="contex" t="">'+data[i].context+'</td></tr>';
}
}else{
str = res.message;
}
$('.content tbody').html(str);
console.log(res)
},
error:function(e){
console.log(e)
}
})
})
</script>
</body>
</html>