ドラッグ可能な画像でデータをエコーアウトするには、jQuery が必要です。ウィンドウに対する画像の位置を呼び出すことができます。エコーアウトするテキストに event.target.nodename を追加しましたが、画像が含まれている html タグのみが返されます。これはすべて問題ありませんが、while ループを使用していくつかの画像を生成しているため、わかりませんどの event.target.nodename がどのイメージを参照しているか。jQuery コードのサンプルを次に示します。
$(document).ready(function(){
$(function()
{
$(".ui-widget-content").draggable(
{
stop: function(event,ui)
{
var Stoppos = $(this).position();
$(".location").text("STOP: \nLeft: "+ Stoppos.left + "\nTop: " + Stoppos.top +
event.target.nodeName);
}
}
);
$(".droppable").droppable();
});
});
注: while ループの各画像は一意のクラスを生成するため、クラスに基づいて各画像を識別する際に問題はありません。