次の Javascript コードがあります。
$(document).ready(function () {
$(".NewsItemDraggable").draggable({ revert: "invalid" });
$(".RelatedNewsDropDiv").droppable({
accept: ".NewsItemDraggable",
activeClass: "ui-state-hover",
hoverClass: "ui-state-active",
drop: function (event, ui) {
AddReletedNewsItem(ui.draggable, $(this));
}
});
function AddReletedNewsItem($draggedItem, $dropArea) {
var $list = $("ul", $dropArea).length ?
$("ul", $dropArea) :
$("<ul/>");
$dropArea.append($list.append($("<li>").append($draggedItem)));
}
});
HTML:
<-- Multiple occurance of following div-->
<div class="NewsItemDraggable" style="margin-top: 5px">
Some html stuff here
<div class="RelatedNewsDropDiv">
Drop Related News Items Here
</div>
</div>
NewsItemDraggable を別の NewsItemDruggable の RelatedNewsDropDiv にドラッグすると、新しいリスト アイテムが作成されますが、ドラッグされた NewsItemDraggable のコンテンツは表示されません。ここで何が問題になっているようですか?どなたかご指南頂ければ幸いです。
アップデート:
Web を見ると、JQuery Sortable に関連しているように見えますが、どのように/何を理解できませんか、それとも本当に関連していますか?