JQuery UI - Многократный выбор поведения (Ctrl + клик) по умолчанию для «выбора»? - PullRequest
3 голосов
/ 09 августа 2009

Есть ли способ сделать взаимодействие выбора в пользовательском интерфейсе jQuery «множественным выбором» (выбрать с помощью левого клика, снова нажать, чтобы отменить выбор), а не «щелкнуть по эксклюзивному выбору и отменить выбор всего» еще поведение?

1 Ответ

1 голос
/ 19 февраля 2012

Я думаю, что это даст вам ту функциональность, которую вы ищете:

1) В разделе Selectable () последнего файла jquery-ui.js измените функцию _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» к элементу списка и установите для него «true».

<ul multi="true">
  <li>test1</li>
  <li>test2</li>
</ul>

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

Это сделает так, что вы можете выбрать несколько элементов (и отменить выбор), не используя Ctrl + щелчок мыши.

Если я полностью неверно истолковал ваш вопрос. Тогда не обращайте внимания на этот пост.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...