带有各种 jquery 花里胡哨的搜索页面

Question

现在很多 webapps 在他们的搜索页面中使用 jquery 小部件来帮助用户在不离开页面的情况下过滤搜索结果。正因为如此，我注意到 webapps 现在开始在<ul> 代码中编写表/列表，因为它很容易将 ajax 数据附加到它。

我现在很好奇像 airbnb 这样的搜索页面将如何运作。 http://www.airbnb.com/search

当用户更改右侧导航中显示的搜索选项时，他们有一个动态更改的列表。

有人可以指导我查看显示类似内容的教程吗？我正在尝试使用 jquery 在 rails3 中完成类似的事情。任何示例/github repos 都会对我有所帮助。

Answer 1

我不知道这个网站在内部是如何运作的，但我会这样：

• 将事件侦听器绑定到复选框/滑块/whatnot 以调用单个函数：
  • 此函数将遍历所有元素（所有复选框/滑块/等）。
  • 如果给定元素被选中/编辑（例如您移动滑块），该函数会将此元素添加到 ajax 参数中
  • 例如，如果您选中“私人房间”复选框，请执行以下操作：paramlist["PrivateRoom"] = "true"
  • 最后，使用所有参数向后端服务器调用 ajax 函数。
• 在 ajax 回调中，我将使用来自服务器的结果更新结果面板。