Question

我正在尝试使用quicksand.js过滤数据集合。但是，我在显示数据时遇到问题。我已经能够让数据消失。然而，它不会再出现。我创建了一个jsfiddle，可用here。基本上，我的JavaScript看起来像这样：

var $content = $('#stage');
var $data = $content.clone();

function filterData(tag) {
  var data = [];
  if (tag === null) {
    data = $data.find('li');
  } else {
    data = $data.find('li[data-tags=' + tag + ']');
  }

  console.log(data);
  $content.quicksand(data, {
    duration: 800,
    easing: 'easeInOutQuad'
  });
  return false;
}

一切看起来都对我不对。我无法弄清楚我做错了什么。

Answer 1

首先，你的小提琴被打破了。一，您链接quicksand 1.3并将其与最近不支持的jquery版本配对。第二，你在没有链接easeInOutQuad的情况下调出jquery.easing.1.3.js。三，你有范围问题，filterData函数没有全局定义。

你真正的问题是文档中的这一行：

attribute – attribute containing unique value able to identify same item within source and destination collection, default: 'data-id'

您的“阶段”数据li都没有此属性，因此不会正确过滤它们。添加它，一切似乎都有效：

<ul id="stage">
  <li data-tags="A" data-id="1">Item A-1</li>
  <li data-tags="A" data-id="2">Item A-2</li>

  <li data-tags="B" data-id="3">Item B-1</li>
  <li data-tags="B" data-id="4">Item B-2</li>
</ul>

更新了fiddle。

无法让Quicksand.js正常工作

1 个答案: