Question

我有一个div包含的链接图像。我希望能够将链接的图像拖动到一个tinyMCE控件，而不包含其周围的DIV。

HTML：

<div id="image_preview"><a href="somelink"><img src="someimage" /></a></div>

无论出于何种原因，它将DIV与IMG和A一起拖动。有没有办法让它不拖动DIV。我已经尝试在DIV上防止默认的ondrag，onmousedown等，但是没有什么可以拖延。

我试过了：

$(document).ready(function(){
    $('#image_preview').on('mousedown', function(){
        return false;
    });
});

和

$(document).ready(function(){
    $('#image_preview').on('dragstart', function(e){
        e.preventDefault();
    });
});

以及其他一些事情，但当然我知道除了阻止在DIV中拖动任何东西之外，其他任何事都不会做任何事情。

Answer 1

将您的标记更改为：

<div draggable="false"><a href="somelink" draggable="false"><img src="someimage" draggable="true" /></a></div>

你应该能够通过使用类似的东西阻止IE的默认拖动行为：

document.ondragstart = function () { 
    return false; 
};

Answer 2

HTML：

<div id="image_preview"><a href="somelink"><img src="someimage" /></a></div>

    <div id="anotherdiv"></div>

jQuery的：

$(function() {
        $( "img" ).draggable({
            stop: function(event, ui) {
            $(this).appendTo('#anotherdiv');
        }            
        });
});

Answer 3

制作拖拽时我遇到了这个问题。删除图像窗格以与TinyMCE一起使用。这个解决方案适用于我使用Firefox的本机拖放功能。 drop：如上所述，我没有用td，tr等包装img标签，而是在图像前面放了一个小注释：。这足以让它排除拖放中的父元素。掉落，这是一个DIV。我希望这有助于某人！

如何在没有附加父div的情况下拖动链接？

3 个答案: