jQuery Context Menu与jQuery Draggable冲突

我在 jQGrid尝试了 jQuery Context Menu行和 jQuery Draggable行.

我遇到的问题是,自从我添加了jQuery Context Menu后,单击(以及普通拖动)触发了可拖动动作.当我右键单击一行以获取菜单时,看起来有点奇怪,然后在另一行外面单击它(放弃菜单),该行开始跟随光标.

是否与evt.stopPropagation()有关;在jQuery Context Menu的以下代码片段中？

$(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 Context Menu与jQuery Draggable冲突

解决方法

猜你在找的jQuery相关文章