jasny.html
7.03 KB
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
<!DOCTYPE html>
<html lang="zh">
<head>
<th:block th:include="include :: header('功能扩展')" />
<th:block th:include="include :: jasny-bootstrap-css" />
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
<div class="row">
<div class="col-sm-6">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5>文件上传控件 <small>https://github.com/jasny/bootstrap</small></h5>
</div>
<div class="ibox-content">
<div class="form-group">
<label class="font-noraml">输入组示例</label>
<div class="fileinput fileinput-new input-group" data-provides="fileinput">
<div class="form-control" data-trigger="fileinput"><i class="glyphicon glyphicon-file fileinput-exists"></i> <span class="fileinput-filename"></span></div>
<span class="input-group-addon btn btn-white btn-file"><span class="fileinput-new">选择文件</span><span class="fileinput-exists">更改</span><input type="file"></span>
<a href="javascript:;" class="input-group-addon btn btn-white fileinput-exists" data-dismiss="fileinput">清除</a>
</div>
</div>
<div class="form-group">
<label class="font-noraml">按钮示例</label>
<br/>
<div class="fileinput fileinput-new" data-provides="fileinput">
<span class="btn btn-white btn-file"><span class="fileinput-new">选择文件</span><span class="fileinput-exists">更改</span><input type="file" name="..."></span>
<span class="fileinput-filename"></span>
<a href="javascript:;" class="close fileinput-exists" data-dismiss="fileinput" style="float: none">×</a>
</div>
</div>
<div class="form-group">
<label class="font-noraml">图片上传示例</label>
<br/>
<div class="fileinput fileinput-new" data-provides="fileinput">
<div class="fileinput-preview thumbnail" data-trigger="fileinput" style="width: 200px; height: 150px;"></div>
<div>
<span class="btn btn-white btn-file"><span class="fileinput-new">选择图片</span><span class="fileinput-exists">更改</span><input type="file"></span>
<a href="javascript:;" class="btn btn-white fileinput-exists" data-dismiss="fileinput">清除</a>
</div>
</div>
</div>
<div class="form-group">
<label class="font-noraml">图片预览示例</label>
<br/>
<div class="fileinput fileinput-new" data-provides="fileinput">
<div class="fileinput-new thumbnail" style="width: 140px; height: 140px;">
<img th:src="@{/img/profile.jpg}">
</div>
<div class="fileinput-preview fileinput-exists thumbnail" style="max-width: 200px; max-height: 150px;"></div>
<div>
<span class="btn btn-white btn-file"><span class="fileinput-new">选择图片</span><span class="fileinput-exists">更改</span><input type="file"></span>
<a href="javascript:;" class="btn btn-white fileinput-exists" data-dismiss="fileinput">清除</a>
</div>
</div>
</div>
<hr>
<div class="form-group">
<label class="font-noraml">相关参数详细信息</label>
<div><a href="http://doc.ruoyi.vip/ruoyi/document/zjwd.html#jasny-bootstrap" target="_blank">http://doc.ruoyi.vip/ruoyi/document/zjwd.html#jasny-bootstrap</a></div>
</div>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5>固定格式文本 <small>https://github.com/jasny/bootstrap</small></h5>
</div>
<div class="ibox-content">
<div class="form-group">
<label class="font-noraml">手机号码格式</label>
<input type="text" class="form-control" data-mask="999-9999-9999" placeholder="请输入手机号码">
<span class="help-block">158-8888-88888</span>
</div>
<div class="form-group">
<label class="font-noraml">电话号码格式</label>
<input type="text" class="form-control" data-mask="9999-9999999" placeholder="请输入电话号码">
<span class="help-block">0730-8888888</span>
</div>
<div class="form-group">
<label class="font-noraml">日期格式</label>
<input type="text" class="form-control" data-mask="9999-99-99" placeholder="请输入日期格式">
<span class="help-block">yyyy-mm-dd</span>
</div>
<div class="form-group">
<label class="font-noraml">IPV4格式</label>
<input type="text" class="form-control" data-mask="999.999.999.999" placeholder="请输入IP地址">
<span class="help-block">192.168.100.200</span>
</div>
<div class="form-group">
<label class="font-noraml">税务代码格式</label>
<input type="text" class="form-control" data-mask="99-9999999" placeholder="请输入税务代码">
<span class="help-block">99-9999999</span>
</div>
<hr>
<div class="form-group">
<label class="font-noraml">相关参数详细信息</label>
<div><a href="http://doc.ruoyi.vip/ruoyi/document/zjwd.html#jasny-bootstrap" target="_blank">http://doc.ruoyi.vip/ruoyi/document/zjwd.html#jasny-bootstrap</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: jasny-bootstrap-js" />
</body>
</html>