jQuery拖放显示div名称答案

【问题标题】：jQuery drag-drop display div namejQuery拖放显示div名称
【发布时间】：2013-02-16 13:35:20
【问题描述】：

我需要一个额外的脚本插件帮助。在我拖放项目后，它会打印出：dropped。有没有办法将其打印为类项名称？像：如果我拖动 Item1 它会打印出 Item 1 依此类推，有 item2、item3、item4、item5 等等。

<link rel="stylesheet" href="css/style.css" type="text/css"></link>
<script type="text/javascript" src="js/jquery1.4.2.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.2.custom.min.js"></script>
<script type="text/javascript" src="js/dragdrop.js"></script>

<div id="xx" class="out">
    <p>Drop here</p>
</div>

<div class="item" name="item1">Item1</div>
<div class="item" name="item2">Item2</div>

项目 3

$(function() {
        $(".item").draggable({
                revert: true
        });
        $("#xx").droppable({
                tolerance: 'touch',
                over: function() {
                       $(this).removeClass('out').addClass('over');
                },
                out: function() {
                        $(this).removeClass('over').addClass('out');
                },
                drop: function() {
                    $( this ).find( "p" ).html( "Dropped!" );
                        $(this).removeClass('over').addClass('out');
                }
        });
});

【问题讨论】：

标签： jquery jquery-ui drag-and-drop jquery-ui-draggable

【解决方案1】：

您希望这种情况发生吗？ jsfiddle

drop: function(e, ui) {
     $( this ).find( "p" ).html('Dropped ' + ui.draggable.attr('name'));
     $(this).removeClass('over').addClass('out');
}

【讨论】：

【解决方案2】：

如果我理解正确，你会想要这个：

        drop: function() {
            $( this ).find( "p" ).html( $( this ).attr("class") );
            $(this).removeClass('over').addClass('out');
        }

【讨论】：