使网页上的文字可拖动

Question

继承人我正在努力做的事情。

1. 用户从页面中选择文字
2. 突出显示的文字现在应该是可拖动的
3. 该文字现已下载为可放置的
4. 将文字提醒给我们。

这是我用来检测所选文字的代码。

if (!window.x) {
    x = {};
}
x.Selector = {};
x.Selector.getSelected = function() {
    var t = '';
    if (window.getSelection) {
        t = window.getSelection();
    } else if (document.getSelection) {
        t = document.getSelection();
    } else if (document.selection) {
        t = document.selection.createRange().text;
    }
    return t;
}

$(function() {
    $(document).bind("mouseup", function() {
        var mytext = x.Selector.getSelected();
        alert(mytext);
});

一切正常，直到这里，我试着这样做。

$(function() {
    $(document).bind("mouseup", function() {
        var mytext = x.Selector.getSelected();
    alert(mytext);
    var item=$(mytext);
    $(item).draggable({
            start:function(event,ui){$( "#draggable" ).draggable( "option", "revert", true );},
        stop:function(event,ui){$( "#draggable" ).draggable( "option", "revert", true );}

    });

    $("#droppable").droppable({
        accept: item ,
        drop: function() { alert($('#draggable').text()); }
    });    
});

如何将文本转换为可拖动文本，请帮忙，欢迎任何新方法。

Answer 1

有趣..

var item=$(mytext);

您无法选择文本作为DOM元素。您应该将其添加到新创建的元素，例如<p>

$("<p>"+mytext+</p>").appendTo("body").dragable({...}).