JS，京东上的和淘宝上的条件筛选功能是怎么做的，如果知道能简单说下实现原理吗？

JavaScript05

JS，京东上的和淘宝上的条件筛选功能是怎么做的，如果知道能简单说下实现原理吗？,第1张

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

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

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

var each = $(".sys_item_mktprice").text()

var total = $(".sys_item_price")

$(":text.sys_count_input").keyup(function(){

    var me = $(this), txt = parseFloat(me.val())

    total.text(txt * each)

})