searchFilterShop.html
3.91 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
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="user-scalable=0, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
<meta content="telephone=no" name="format-detection" />
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>地利批发-搜索</title>
<!-- css -->
<!-- <link rel="stylesheet" type="text/css" href="../public/css/style/searchFilter.css"> -->
<link rel="stylesheet" href="../css/style/common.css">
<link rel="stylesheet" href="../css/style/searchFilter.css">
<!-- base seajs -->
<script type="text/javascript" src="http://static.nong12.com/static/newStatic/common/js/base/sea.js"></script>
<!-- base jquery -->
<script type="text/javascript" src="http://static.nong12.com/static/newStatic/common/js/base/jquery-2.1.3.min.js"></script>
</head>
<body>
<!-- 搜索输入开始 -->
<!-- <header class="header">
<a href="#" class="rback-word">取消</a>
<div class="search">
<form id="searchIndex" action="searchIndex_submit" method="get" accept-charset="utf-8">
<div class="search-area clearfix">
<span class="filter-word">筛选</span>
<input type="hidden" name="t" value="0" />
</div>
<input type="submit" value="确定" class="submit-button" />
</form>
</div>
</header> -->
<!-- 搜索输入结束 -->
<header class="m-header">
<div class="head">
<a href="#" class="lt-bar text">取消</a>
<h1>筛选</h1>
<a href="#" class="rt-bar text">确定</a>
</div>
</header>
<div class="content" id="cotent">
<ul class="m-table-view">
<li class="cell acc-icon">
<span class="title">商品分类</span><span class="text">全部</span>
</li>
<li class="cell acc-icon">
<span class="title">提货点</span><span class="text">全部</span>
</li>
<li class="cell acc-icon">
<span class="title">商品产地</span><span class="text">全部</span>
</li>
</ul>
<ul class="m-table-view">
<li class="cell price-range">
<span class="title">价格区间</span>
<span class="text">
<input type="number" class="p-min"/><b> 元</b>
<span>-</span>
<input type="number" class="p-max"/><b> 元</b>
</span>
</li>
<li class="cell acc-icon">
<span class="title">卖家</span><span class="text">全部</span>
</li>
</ul>
</div>
<!-- 用于显示渲染后的标签 -->
<ul id="element"></ul>
<!-- config -->
<script type="text/javascript" src="../js/javascript/common/config.js"></script>
<!-- 定义模板，将模板内容放到一个script标签中 -->
<script type="text/template" id="tpl">
<%_.each(list, function(item){%>
<li>
<span><%=item.city%></span>
</li>
<%})%>
</script>
<script type="text/javascript">
seajs.use( ['../js/javascript/common/common.js'] , function(){
// 获取渲染元素和模板内容
var element = $('#element'),
tpl = $('#tpl').html();
// 创建数据, 这些数据可能是你从服务器获取的
var data = {
list: [
{firstName: '<a href="#">Zhang</a>', lastName: 'San', city: 'Shanghai'},
{firstName: 'Li', lastName: 'Si', city: '<a href="#">Beijing</a>'},
{firstName: 'Wang', lastName: 'Wu', city: 'Guangzhou'},
{firstName: 'Zhao', lastName: 'Liu', city: 'Shenzhen'}
]
}
// 解析模板, 返回解析后的内容
var html = _.template(tpl)(data);
// 将解析后的内容填充到渲染元素
element.html(html);
});
seajs.use([
'../js/javascript/search/searchFilter.js'
]);
</script>
</body>
</html>