Контекстное меню jQuery конфликтует с jQuery Draggable

Question

Я пробую контекстное меню jQuery с jQuery Draggable строк в jQGrid .

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

Имеет ли это отношение к evt.stopPropagation(); в следующем фрагменте из контекстного меню jQuery?

$(this).mousedown( function(e) {
    var evt = e;
    evt.stopPropagation();
    $(this).mouseup( function(e) {
        e.stopPropagation();
        var srcElement = $(this);
        $(this).unbind('mouseup');
        if( evt.button == 2 ) {
            // Hide context menus that may be showing
            $(".contextMenu").hide();

Могу ли я с этим что-нибудь сделать, кроме выбора между перетаскиваемым или контекстным меню?

Answer 1

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

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

jQuery(this).mousedown( function(e) {
    var evt = e;
    if (e.button == 2) //Added to make this compatible with draggable
        evt.stopPropagation();
    jQuery(this).mouseup( function(e) {
        if (e.button == 2) //Added to make this compatible with draggable
            e.stopPropagation();
        var srcElement = jQuery(this);

Добавление проверки для e.button == 2 останавливает распространение события щелчка правой кнопкой мыши, и теперь мои перетаскиваемые элементы div остаются перетаскиваемыми, а контекстное меню по-прежнему работает.До сих пор я проверял это только в IE8, и я не знаю, решит ли это вашу проблему, но мне интересно знать, если это так.

== EDIT ==

По предложению от Carl R для совместимости с Chrome:

jQuery(this).mousedown( function(e) {
    var evt = e;
    if (e.button != 2) return; //Added to make this compatible with draggable
    evt.stopPropagation();
    jQuery(this).mouseup( function(e) {
        e.stopPropagation();
        var srcElement = jQuery(this);

Я изменил режим, как он предложил, и в IE8 он отлично работает.

Answer 2

У меня была та же проблема, и я просто прокомментировал первые два * .stopPropagation () из jquery.contextMenu.js. Теперь все работает правильно.

Единственное возможное использование этих остановок в этом случае может быть для некоторой минимальной производительности. Фактически, замена их на * .preventDefault () имела бы больше смысла для меня. Я что-то упустил?