2

我正在使用 jQuery 1.8.3 和 jQuery UI 1.9.2。
我的 Web 应用程序有一些可拖动的元素，我想允许用户在包含的元素中选择一些文本。
我已经看到有关此主题的其他一些问题。
我正在遵循的另一条路径是使用鼠标右键单击并使用我找到的一些文本选择插件。我仍然无法让它工作。

似乎可拖动/可排序元素不允许文本选择或可以拦截鼠标（点击）事件。

有任何想法吗？

4

2 回答 2

2

我相信您的方法是正确的，您可以使用右键单击从某些 div 复制文本。

例如：

<script src="http://cachedcommons.org/cache/zero-clipboard/1.0.7/javascripts/zero-clipboard-min.js" type="text/javascript"></script>
<div id="dragme" class="temp">Draggable Text</div>

除了 jquery-ui 之外，以下 JavaScript 应该允许您使用左键单击拖放 div，然后右键单击以复制 div 内的文本：

$("#dragme").draggable();

$.event.special.rightclick = {
    bindType: "contextmenu",
    delegateType: "contextmenu"
};

ZeroClipboard.setMoviePath('http://zeroclipboard.googlecode.com/svn/trunk/ZeroClipboard10.swf');
//Create a new clipboard client
var clip = new ZeroClipboard.Client();

$(document).on("rightclick", ".ui-draggable", function() {

        //Grab the text from the parent row of the icon
        var txt = $(this).text();
        alert("Copying text: "+txt);
        clip.setText(txt);
        clip.glue(this);

        //Add a complete event to let the user know the text was copied
        clip.addEventListener('complete', function(client, text) {
            alert("Copied text to clipboard:\n" + text);
        });
        clip.hide();
        return false;
});

我为此有一个jsfiddle，但我认为带有 ZeroClipboard 的 SWF 副本与 jsfiddle 不一致。
但它应该在您的开发环境中工作。

于 2012-11-28T23:01:39.987 回答
1

使用 on mouseenter 事件从父元素中删除可拖动类，以便子元素选择文本。然后使用 on mouseleave 为子元素在父元素上重新添加可拖动类。

于 2016-09-06T04:30:03.220 回答