section - selectable jquery ui




jQuery上下文菜單與jQuery Draggable發生衝突 (2)

我正在嘗試使用jQueryGrid中的 jQuery Draggable行的jQuery上下文菜單

我遇到的問題是,因為我添加了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();

除了在可拖動或上下文菜單之間進行選擇,還有什麼可以做的嗎?


我有一個相關的問題 - 可拖動的項目與附加的上下文菜單並不總是可拖動的。 在我的情況下,只能拖動一次可拖動的項目(浮動在一個較大的包含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中測試過這個,我不知道它是否能解決你的問題,但是我很想知道它是否可以。

== ==編輯

根據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中這樣工作得很好。


我有同樣的問題,並從jquery.contextMenu.js簡單地評論了前兩個* .stopPropagation()。 現在一切正常。

在這種情況下唯一可能使用這些停止可能是一些最小的性能。 實際上用* .preventDefault()替換這些對我來說更有意義。 我錯過了什麼嗎?





jquery-ui-draggable