天猫的全部筛选功能怎么做 js

JavaScript015

天猫的全部筛选功能怎么做 js,第1张

js商品筛选功能的具体代码步骤如下：

1、根据数据结构生成HTML结构（利用dom操作）。

2、获取每一个li,给每一个li中每一个a标签绑定事件处理函数。

3、点击a标签，把a标签的内容添加在对象中，同时添加样式。

4、根据对象存的属性生成选择则条件的HTML结构（按顺序排列）。

5、点击关闭选择的条件，删除数据，移除HTML结构，去除在其对应的li中的样式。

您好：说一下我们自己商城的实现方式，最初我们用的都是服务器控件。首先先把所有的筛选条件加载到页面上，在用户点击的时候因为都是服务器控件，所以每次都会回发，我们给每个控件都有一个唯一的ID标识，这样每次点击后，把查询条件拼接到sql中查询出数据后，把当前点击的筛选条件存到ViewState中，然后页面刷新后去读取这个ViewState的值。也就是你页面上有几类筛选条件就需要几个ViewState值来存储。

后来因为数据从后台回发到前台，百度抓取的时候是抓不到的，不利于商城的SEO优化。最后决定把所有的筛选条件都拼接到URL中进行传值。这也是大多数网站采用的方式。就是举个例子：查询学生信息，筛选条件类型有，身高，体重，年龄。那么筛选条件都有a标签，连接是这样<a href='http://www.student.com/studentlist.html?age=18'></a>这样。点身高的时候先把连接中加上身高的的条件然后刷新页面。这样在后台直接request获取值，然后查询数据库即可。为此我们也自己写了一个根据传入的筛选条件来返回不同url的实体类方法。很简单。京东淘宝筛选也是刷新页面的。

查询完后，也是根据url中的值来锁定哪个筛选条件来显示选中状态。

<script>

var products=[{id:"1001",name:"a"},{id:"1002",name:"hava1001"}]

for(var i in products){

var p=products[i].id

//alert(p.charAt("1001")!=-1)charAt是判断id字段是否包含‘1001’,查询不到返回-1

if(p.charAt("1001")!=-1){

alert("产品编号："+products[i].id+"产品名称："+products[i].name)

break

}

}

</script>

products[索引]获得json数组对象，然后 对象.属性 获得属性值。

类比 一下 你就明白怎样筛选，希望我的回答能帮到您，也希望您对我的回答做出评价

兼_听则明

http://hi.baidu.com/你我同步/home