Question

列表中的某些项目有关联的数据，例如下面显示使用jQuery添加到一个项目的数据，第一个：

$('ul li :first').data('job', 'Developer');
$('ul li :first').data('company', 'Microsoft');
$('ul li :first').data('location', 'UK');

如果job, data, location都有复选框，用户可以选择例如：

<label>
    Developer<input type="checkbox"/>
</label>
<label>
    Tester<input type="checkbox"/>
</label>
<label>
    Lead Developer<input type="checkbox"/>
</label>
<label>
    Google<input type="checkbox"/>
</label>
<label>
    Microsoft<input type="checkbox"/>
</label>
<label>
    UK<input type="checkbox"/>
</label>
<label>
    US<input type="checkbox"/>
</label>

最初显示列表中的所有项目。当用户选中复选框时，列表中没有该属性的所有项都将被隐藏。

有没有人知道我可以采取的方法，在工作，公司和位置有多种选择？

Answer 1

如果查看jQuery data()文档，您会看到该值可以是任何Javascript类型，包括Array或Object。

所以你可以这样做：

$('ul li:first').data('job', ['Developer', 'Cleaner', 'Cook', 'Time waster']);

或

$('ul li:first').data([{
  job: "Developer",
  company: "Microsoft",
  location: "UK"
},{
  job: "Manager",
  company: "Freelance",
  location: "Moon"
}]);

然后，您可以将推送成员添加到阵列。

$('#my_checkbox').check(function(){
    $('ul li:first').data("job").push($(this).value());
});

或者将元素添加到哈希中，或者根据您选择的数据结构执行任何操作。

jQuery中的选项过滤器

1 个答案: