Question

我正在尝试实现一个类似于比较图表的表，除了我需要的一些功能更改之外，大量可选对象才能完美地工作。我看到这两个问题都已在之前的问题中得到解决，但它们都没有提供完整的解决方案。

默认情况下，

This question解决了多重选择行为，但只提到“我自己做了”而没有提供任何内容。看看selectable的内部，我看到如果我玩！event.metaKey条件我可能会得到我正在寻找的行为没有太多麻烦，但是想知道是否有人有一个不涉及编辑的解决方案内部。

类似地，this page解决了我想要的套索切换效果，但是我不确定代码中的套索功能在哪里被更改，并且因为脚本的其余部分（可排序的功能）被报告为不在chrome或IE8（link）工作并且已经过时了，我宁愿不依赖于整个事情。

所以如果有人能帮我解决这些问题，我会很感激。感谢

[编辑]格式化...

Answer 1

我确信有更好的方法可以做到这一点，但这是我在可选择的js文件中所做的。

总是多选：

我添加了一个'alwaysMulti'选项（默认为false）。然后，我将!event.metaKey的三个实例替换为(!event.metaKey && !options.alwaysMulti)，将event.metaKey的两个实例替换为(event.metaKey || options.alwaysMulti)。

要让选择套索切换所选状态，我在链接到的第二页上找到了所需的更改。我还添加了一个选项'lassoToggle'（默认为false）来触发此功能。在_mouseDrag中，有一个条件if (hit)，它会更改为以下内容：

    if (hit) {
                // SELECT
                selectee.deselect = false;
                if (selectee.selected || (options.lassoToggle && (selectee.startselected && event.metaKey)) {
                    selectee.$element.removeClass('ui-selected');
                    selectee.selected = false;
                    selectee.deselect = true;
                }
                if (selectee.unselecting) {
                    selectee.$element.removeClass('ui-unselecting');
                    selectee.unselecting = false;
                }
                if (!selectee.selecting && (!options.lassoToggle || !selectee.deselect) {
                    selectee.$element.addClass('ui-selecting');
                    selectee.selecting = true;
                    // selectable SELECTING callback
                    self._trigger("selecting", event, {
                        selecting: selectee.element
                    });
                }
                if(selectee.deselect && options.lassoToggle) {
                    selectee.$element.removeClass('ui-selecting');
                    selectee.selecting = false;
                    selectee.$element.addClass('ui-unselecting');
                    selectee.unselecting = true;
                    // selectable UNSELECTING callback
                    self._trigger("unselecting", event, {
                        unselecting: selectee.element
                    });
                }
            }

注意：多选的event.metaKey更改不在该代码示例中。

希望这有助于其他人！

默认情况下jQueryUI多选，并具有套索切换选定状态

1 个答案: