jQuery UI Selectable-отменить выбор выбранного элемента по щелчку

кто-нибудь знает, есть ли способ настроить выбираемый элемент jQuery ui, чтобы отменить выбор выбранного элемента при его нажатии? Вроде как тумблер. Если он уже выбран, снимите его, в противном случае выполните поведение по умолчанию.

спасибо.

13
jquery jquery-ui jquery-ui-selectable selectable unselect

4 ответов

Я очень поздно отвечаю на ваш вопрос, но позвольте мне просто ответить на него в любом случае, чтобы сохранить его в качестве ссылки для других.

$( ".selector" ).bind( "mousedown", function ( e ) {
    e.metaKey = true;
} ).selectable();

Это позволит переключать поведение, которое вы ищете.

37

Ну вот что я только что сделал. Я использовал имя класса для переключения выбора и отмены выбора. Я хотел бы услышать, Есть ли другой вариант:

$("#selectable").selectable({
    selected: function (event, ui) {
        if ($(ui.selected).hasClass('selectedfilter')) {
            $(ui.selected).removeClass('selectedfilter');
            // do unselected stuff
        } else {            
            $(ui.selected).addClass('selectedfilter');
            // do selected stuff
        }
    },
    unselected: function (event, ui) {
        $(ui.unselected).removeClass('selectedfilter');
    }
});
11

Если вы хотите, чтобы существующие выборки были сохранены и все же имели операцию переключения, вам просто нужно игнорировать невыбранное событие для данного решения. Также необходимо удалить ui-выбранный класс.

$("#selectable").selectable({
selected: function (event, ui) {
    if ($(ui.selected).hasClass('selectedfilter')) {
        $(ui.selected).removeClass('selectedfilter').removeClass('ui-selected');
        // do unselected stuff
    } else {            
        $(ui.selected).addClass('selectedfilter').addClass('ui-selected');
        // do selected stuff
    }
}
});
2

это то, что вы имеете в виду?

это событие запускается в конце операции select для каждого элемента, удаленного из выборки.

примеры кода

предоставьте функцию обратного вызова для обработки невыбранного события в качестве опции init.

$( ".selector" ).selectable({
   unselected: function(event, ui) { ... }
});
Bind to the unselected event by type: selectableunselected.
$( ".selector" ).bind( "selectableunselected", function(event, ui) {
  ...
});

источник:

http://jqueryui.com/demos/selectable/#event-unselected

0