jQuery UI – 默认为’selectable’的多选行为(ctrl + click)?

有没有办法让jQuery UI的可选择交互进入“多选”(通过左键单击选择,再次单击以取消选择)行为,而不是单击以排他地选择和取消选择一切其他行为?

我认为这将为您提供您正在寻找的function:

1)在最新的jquery-ui.js的Selectable()部分中,修改_MouseStart函数如下所示:

_mouseStart: function(event) { var self = this; this.opos = [event.pageX, event.pageY]; if (this.options.disabled) return; var options = this.options; this.selectees = $(options.filter, this.element[0]); this._trigger("start", event); $(options.appendTo).append(this.helper); // position helper (lasso) this.helper.css({ "left": event.clientX, "top": event.clientY, "width": 0, "height": 0 }); if (options.autoRefresh) { this.refresh(); } var hasMulti = false; if(this.element.attr("multi") == undefined || !eval(this.element.attr("multi"))) { hasMulti = true; } this.selectees.filter('.ui-selected').each(function() { var selectee = $.data(this, "selectable-item"); selectee.startselected = true; if (!event.metaKey) { if(hasMulti) { selectee.$element.removeClass('ui-selected'); selectee.selected = false; selectee.$element.addClass('ui-unselecting'); selectee.unselecting = true; // selectable UNSELECTING callback self._trigger("unselecting", event, { unselecting: selectee.element }); } } }); $(event.target).parents().andSelf().each(function() { var selectee = $.data(this, "selectable-item"); if (selectee) { var doSelect = false; if(hasMulti) { doSelect = !event.metaKey || !selectee.$element.hasClass('ui-selected'); } else { doSelect = !selectee.$element.hasClass('ui-selected'); } selectee.$element .removeClass(doSelect ? "ui-unselecting" : "ui-selected") .addClass(doSelect ? "ui-selecting" : "ui-unselecting"); selectee.unselecting = !doSelect; selectee.selecting = doSelect; selectee.selected = doSelect; // selectable (UN)SELECTING callback if (doSelect) { self._trigger("selecting", event, { selecting: selectee.element }); } else { self._trigger("unselecting", event, { unselecting: selectee.element }); } return false; } }); } 

2)然后,在标记中,将名为“multi”的属性添加到list元素并将其设置为“true”。

 
  • test1
  • test2

您将看到我添加了一个名为hasMulti的var,并在两个条件中使用它来实现所需的行为。

这将使您可以选择多个项目(并取消选择),而无需使用ctrl +鼠标单击。

如果我完全误解了你的问题。 然后忽略这篇文章。