Как реализовать функциональность переключения на JQuery UI Selectable? - PullRequest
6 голосов
/ 19 апреля 2011

Я использую JQuery UI - Выбирается .Я хочу отменить выбор элемента, если он был нажат, и он уже был выбран (переключатель)

Не могли бы вы помочь мне добавить эту функцию, пожалуйста!

Ответы [ 3 ]

21 голосов
/ 19 апреля 2011

Из-за всех обратных вызовов класса вы не добьетесь гораздо большего успеха:

$(function () {
        $("#selectable").selectable({
            selected: function (event, ui) {
                if ($(ui.selected).hasClass('click-selected')) {
                    $(ui.selected).removeClass('ui-selected click-selected');

                } else {
                    $(ui.selected).addClass('click-selected');

                }
            },
            unselected: function (event, ui) {
                $(ui.unselected).removeClass('click-selected');
            }
        });
    });
1 голос
/ 19 апреля 2011

У вас уже есть эта функциональность с возможностью выбора jQuery UI, если вы удерживаете нажатой клавишу Ctrl при нажатии.

Если вам действительно нужно это как функциональность по умолчанию, вам не нужно использовать selectable, вы можете сделать это просто как простой обработчик onclick, например, как предложил nolabel.

Или ... вы также можете отредактировать jquery.ui.selectable.js и добавить опцию, которая делает именно то, что вам нужно. Не должно быть слишком сложно, есть 4 места, где отмечен event.metaKey , убедитесь, что ваш вариант установлен, просто запустите кодовые пути, как если бы event.metaKey всегда был true.

Поскольку селектируемые объекты могут использовать некоторые дополнительные настройки, вы также можете сделать запрос функции для разработчиков пользовательского интерфейса jQuery, чтобы включить его в следующую официальную версию.

0 голосов
/ 22 ноября 2011

Вы должны добавить два простых элемента в код, чтобы достичь того, что вы хотите.Это просто инвертирует булево значение metaKey всякий раз, когда вам нужна функция инвертирования / переключения.

options: {
    appendTo: 'body',
    autoRefresh: true,
    distance: 0,
    filter: '*',
    tolerance: 'touch',
    inverted: false /* <= FIRST*/
},

_mouseStart: function(event) {
    var self = this;

    this.opos = [event.pageX, event.pageY];

    if (this.options.disabled)
        return;

    var options = this.options;

    if (options.inverted) /* <= SECOND*/
        event.metaKey = !event.metaKey; /* <= SECOND*/
...