javascript - 使网页上的文本可拖动

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({...}).