Несколько событий jQuery

Question

Я знаю, как связать несколько событий и все такое. То, что я хочу сделать, это иметь несколько событий для запуска функции.

Как

$ (this) .click и $ (this) .mousemove запускают функцию

Есть ли способ сделать это? Это возможно или я просто сплю.

Answer 1

Вы можете использовать специальные события jQuery , чтобы упорядочить все и оптимизировать вещи в процессе. Комбинация mousedown и mousemove также обычно называется «drag», так что вот пример создания события перетаскивания, которое вы можете привязать к элементам. Обратите внимание, что этот код относится к jQuery 1.4.2

Одним из преимуществ использования этого является то, что вы связываете обработчики mousemove, mouseout и mousedown только один раз для каждого элемента, независимо от того, сколько раз этот элемент связан с событием drag. Теперь это не самый оптимальный способ сделать это, и вы можете установить только 3 обработчика для документа и управлять всем с ним, что одинаково легко сделать с помощью API специальных событий. Он просто обеспечивает красиво упакованный способ построения сложных взаимодействий, который был бы возможен только с помощью собственных событий или пользовательских событий в смысле jQuery.

$("..").bind("drag", function() {
   ...
});

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

См. Пример этого здесь . Чтобы создать это специальное событие, используйте:

jQuery.event.special.drag = {
    // invoked each time we bind drag to an element
    add: function(obj) {
        var originalHandler = obj.handler;

        obj.handler = function(event) {
            var el = jQuery(this);

            if(el.data('mousePressed')) {
                return originalHandler.apply(this, arguments);
            }
        };
    },

    // invoked only the first time drag is bound per element
    setup: function(data, namespaces) {
        var el = jQuery(this);

        el.data('mousePressed', false);
        el.bind('mousedown', function() {
            jQuery(this).data('mousePressed', true);
        });
        jQuery(document).bind('mouseup', function() {
            el.data('mousePressed', false);
        });
        el.bind('mousemove', jQuery.event.special.drag.handler);
    },

    // invoked when all drag events are removed from element
    teardown: function(namespaces) {
        var el = jQuery(this);

        jQuery.removeData(this, 'mousePressed');
        el.unbind('mousedown');
        el.unbind('mouseup');
    },

    // our wrapper event is bound to "mousemove" and not "bind"
    // change event type, so all attached drag handlers are fired
    handler: function(event) {
        event.type = 'drag';
        jQuery.event.handle.apply(this, arguments);
    }
};

Answer 2

Теперь, имея лучшее понимание, вы можете сделать одно событие bind и unbind другое:

Пример: http://jsfiddle.net/ZMeUv/

$(myselector).mousedown( function() {
    $(document).mousemove(function() {
        // do something
    });

    $(document).mouseup(function() {
        $(this).unbind();  // unbind events from document
    });
});

Это предотвращает постоянный выстрел mousemove, когда он вам не нужен.

Answer 3

Попробуйте что-нибудь подобное?

var isDown = false;

$(sel).mousedown(function() {
    isDown = true;
});

$(sel).mouseup(function() {
    isDown = false;
});

$(sel).mousemove(function() {
    if (isDown) {
         // Mouse is clicked and is moving.
    }
});

Answer 4

Хорошо, спасибо за идею, Патрик. Это напомнило мне, как я делал что-то подобное в Java.

var m_down = false; $ (this) .mousedown (function () {

 m_down = true;

});

$ (this) .mouseup (function () {

 m_down = false;

}); * +1011 *

$ (this) .mousemove (function () {

 // Code to occur here

});

Answer 5

Если я правильно читаю ваш вопрос, вы спрашиваете о необходимости сочетания нескольких событий для запуска одной функции.Можно достичь такого рода вещей, но я думаю, что это будет сильно зависеть от конкретных событий и логики или нелогичности их комбинации.Например, событие mousemove:

... запускается всякий раз, когда указатель мыши перемещается, даже для пикселя.Это означает, что сотни событий могут быть сгенерированы в течение очень небольшого промежутка времени.

Сравните это с событием mousedown, которое - ну, по одному на клик.Как совместить?API jQuery продолжает указывать:

Обычный шаблон - связать обработчик mousemove из хандера mousedown [sic] и отсоединить его от соответствующего обработчика mouseup,При реализации этой последовательности событий помните, что событие mouseup может быть отправлено в элемент HTML, отличный от события mousemove.Чтобы учесть это, обработчик mouseup обычно должен быть привязан к элементу, находящемуся высоко в дереве DOM, например <body>.

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

Ссылки: jQuery API: mousemove ()