-
Notifications
You must be signed in to change notification settings - Fork 0
/
modheader.html
133 lines (115 loc) · 4.43 KB
/
modheader.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
<!doctype html>
<html class="no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>车生活</title>
<!-- Set render engine for 360 browser -->
<meta name="renderer" content="webkit">
<!-- No Baidu Siteapp-->
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="icon" type="image/png" href="assets/i/favicon.png">
<!-- Add to homescreen for Chrome on Android -->
<meta name="mobile-web-app-capable" content="yes">
<link rel="icon" sizes="192x192" href="assets/i/[email protected]">
<!-- Add to homescreen for Safari on iOS -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="车生活" />
<link rel="apple-touch-icon-precomposed" href="assets/i/[email protected]">
<!-- Tile icon for Win8 (144x144 + tile color) -->
<meta name="msapplication-TileImage" content="assets/i/[email protected]">
<meta name="msapplication-TileColor" content="#0e90d2">
<link rel="stylesheet" href="assets/css/amazeui.min.css">
<link rel="stylesheet" href="assets/css/app.css">
</head>
<body>
<header data-am-widget="header" class="am-header am-header-default">
<div class="am-header-left am-header-nav">
<a href="javascript:history.go(-1)" class="">
<i class="am-header-icon am-icon-chevron-left"></i>
</a>
</div>
<h1 class="am-header-title">
<a href="#title-link" class="">修改头像</a>
</h1>
<div class="am-header-right am-header-nav">
<a href="javascript:;" id="nav_click" class="">
<i class="am-menu-toggle-icon am-icon-th-large am-icon-sm"></i>
</a>
</div>
</header>
<div style="height:50px"></div>
<form action="my.html" class="am-form" id="doc-vld-msg">
<div class="am-g am-g-fixed">
<div class="am-u-sm-12" id="imgdiv" id="imgdiv">
<img src="assets/i/other/header.jpg" style="width:200px;height:200px" id="imgShow" class="am-img-thumbnail am-circle">
</div>
<div class="am-u-sm-12">
<hr data-am-widget="divider" style="" class="am-divider am-divider-default" />
</div>
<div class="am-u-sm-12">
<div class="am-form-group am-form-file">
<button type="button" class="am-btn am-radius am-btn-danger am-btn-sm ">
<i class="am-icon-cloud-upload"></i> 选择要上传的图片</button>
<input id="up_img" accept="image/*" type="file">
</div>
<div id="file-list"></div>
</div>
<div class="am-u-sm-12">
<div class="am-form-group">
*部分机型不支持上传头像,请下载客户端操作。
</div>
</div>
<div class="am-u-sm-12">
<button class="am-btn am-btn-success am-radius am-btn-block" type="submit">修改</button>
</div>
</div>
</form>
<script type="text/x-handlebars-template" id="amz-tpl">
{{>navbar navbar}}
</script>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/amazeui.min.js"></script>
<script src="assets/js/handlebars.min.js"></script>
<script src="assets/js/amazeui.widgets.helper.js"></script>
<script src="assets/js/app.js"></script>
<script src="assets/js/uploadPreview.js"></script>
<script type="text/javascript">
$(function() {
$('#up_img').on('change', function() {
var fileNames = '';
$.each(this.files, function() {
fileNames += '<span class="am-badge">' + this.name + '</span> ';
});
//$('#file-list').html(fileNames);
});
new uploadPreview({
UpBtn: "up_img",
DivShow: "imgdiv",
ImgShow: "imgShow"
});
$('#doc-vld-msg').validator({
onValid: function(validity) {
$(validity.field).closest('.am-form-group').find('.am-alert').hide();
},
onInValid: function(validity) {
var $field = $(validity.field);
var $group = $field.closest('.am-form-group');
var $alert = $group.find('.am-alert');
// 使用自定义的提示信息 或 插件内置的提示信息
var msg = $field.data('validationMessage') || this.getValidationMessage(validity);
if (!$alert.length) {
$alert = $('<div class="am-alert am-alert-danger"></div>').hide().
appendTo($group);
}
$alert.html(msg).show();
}
});
});
</script>
</body>
</html>