Question

我有两个复选框列表（稍后会有其他列表），例如：

<ul>
    <li><input type="checkbox" onchange="handleChange()" name="job" rel="it-manager" value="IT-Manager" id="IT Manager" class="selectedId" checked> IT Manager</li>
    <li><input type="checkbox" onchange="handleChange()" name="job" rel="consultant" value="Consultant" id="Consultant" class="selectedId" checked> Consultant</li>
</ul>
<ul>
    <li><input type="checkbox" onchange="handleChange()" name="reg" rel="client" value="Client" id="Client" checked> Client</li>
    <li><input type="checkbox" onchange="handleChange()" name="reg" rel="prospect" value="Prospect" id="Prospect" checked> Prospect</li>
<ul>

每当选中/取消选择复选框组合时，都会过滤一组对象。

问题在顶部添加“全选”框的最佳方法是什么？我希望功能就像this example一样。我已尝试实现该示例，并且复选框功能完美运行，但我似乎无法使过滤器正确更新。

我在if else中尝试了filteredBy次陈述无济于事。我已经尝试了一个额外的窗口功能来处理“全选”按钮，但这就搞砸了。

我意识到这是一个有点模糊的问题，但我希望有人可能会遇到这个问题。我感谢任何可以指出我正确方向的建议。 JSFIDDLE谢谢！

更多上下文细节每当输入标签中选中/选择复选框的组合onchange时，都会运行handleChange()函数，该函数会过滤一个名为{{1的对象数组并将结果放在var sorted中。它还在该变量上运行一个名为arrayToFilterUpon的函数。

makeFilteredArray

window.handleChange = function() { arrayToFilterUpon = sorted.filter(filterBy); makeFilteredArray(arrayToFilterUpon); }函数只是将它放入一个新数组makeFilteredArray，用于更新d3地图。

filteredArray

目前，当匹配属性值匹配时，过滤器返回数组中的对象（使用“和”逻辑）。

function makeFilteredArray(array) {
    var filteredArray = [];
    filteredArray.push(array);

每次更改复选框时，var function filterBy(e) { return document.getElementById(e.jobRole).checked && document.getElementById(e.regType).checked; }都会更新。

Answer 1

离线获得一些帮助，我的具体案例的解决方案如下。意识到这是一个模糊而庞大的问题，对我有用的解决方案确实直接回答了它，并且与问题中的代码没有完全相关。考虑只是删除这个问题，但现在将保留这个问题，以防这个答案对任何人都有用，作为在多个列表中设置“全选”按钮的起点。

Integer.Max_value

将“全选”复选框添加到更新对象数组的复选框列表中

1 个答案: