Jquery Selectable without holding control

问题

I use the Jquery Selectable But the user have to hold the control button down to select items is there anyway that user can select multiple items without holding control button down ?

in other words: I want the user to be able to Select any item by clicking on it and Unselect it by Clicking again.

回答1:

You can add the class "selected" when the user clicks the elements, and simply remove the class when clicked again.

$(".selectable").click(function(e) {
    $(this).toggleClass("selected");
});

回答2:

You can use a set of custom event handlers to control how selection and deselection behave. With this set of handlers nothing is ever deselected unless it is selected and you click on it again without then doing a range select. If you remove the if (event.detail == 0) { and its related statements then range select will act like range invert -- anything in the range that is selected will be unselected, and vice-versa.

var _selectRange = false, _deselectQueue = [];
$(function() {
    $( "#selectable" ).selectable({
        selecting: function (event, ui) {
            if (event.detail == 0) {
                _selectRange = true;
                return true;
            }
            if ($(ui.selecting).hasClass('ui-selected')) {
                _deselectQueue.push(ui.selecting);
            }
        },
        unselecting: function (event, ui) {
            $(ui.unselecting).addClass('ui-selected');
        },
        stop: function () {
            if (!_selectRange) {
                $.each(_deselectQueue, function (ix, de) {
                    $(de)
                        .removeClass('ui-selecting')
                        .removeClass('ui-selected');
                });
            }
            _selectRange = false;
            _deselectQueue = [];
        }
    });
});

While it lasts, here's a jsfiddle example.

回答3:

You can also use the left mouse button and drag it down to select multiple items. But only adjacent items can be selected by this.

回答4:

The easiest thing is to implement a jQuery click handler which toggles a selected class on your selectable elements. Then just style selected appropriately. jQuery Selectable is more hindrance than help in your case.

来源：https://stackoverflow.com/questions/4999789/jquery-selectable-without-holding-control