2012-08-01 67 views
0

我創建了一個while循環,產生五個圖像。然後,我將圖像設計爲拖放到網頁的可放置部分。然後我想要網頁輸出我放置圖像的位置。我唯一的問題是,我希望代碼也能從我從中獲取圖像的src回顯出來。出於某種原因,每當我點擊任何圖像並拖動它們時,頁面只會回顯while循環所穿過的第一個圖像的src。PHP雖然循環呼叫來自環形圖像的屬性

<script type="text/javascript"> 

$(".droppable").droppable(); 

</script> 

<?php 

$num_dresses = dress_count(); 

$i = 0; 

while ($i < 5) 

{ 

$rand_id = rand(1, $num_dresses); 

$new_file_name = html_entity_decode($dress_feed_data['file_name']); 

if (file_exists('fashion_images/' . $new_file_name)) 

{ 

?> 

<script type="text/javascript" > 

$(document).ready(function(){ 

$(function() 

    { 

$(".ui-widget-content").draggable(

    { 

stop: function(event,ui) 
{ 
    var Stoppos = $(this).position(); 

    var className = $("img").attr("src"); 

    $(".location").text("STOP: \nLeft: "+ Stoppos.left + "\nTop: " + Stoppos.top + 

    className); 

}});});}); 

</script> 

<div class="ui-widget-content"> 

<img src="fashion_images/<?php echo $new_file_name;?> " width="70" height="70"/> 

</div> 

<?php 

} 

$i++; 

} 

?> 

<div class="droppable"></div> 

<div class="location"></div> 
+1

嘗試'$( 「UI的小部件,內容中的img」)拖動({'和'變種的className = $(本)。 attr(「src」);' – 2012-08-01 07:15:00

+0

@ Beetroot-Beetroot感謝您的幫助,它的工作原理!如果您將它作爲答案發布,我會接受它。 – jason328 2012-08-01 07:34:19

回答

1

傑森,

嘗試:

$(".ui-widget-content img").draggable({ 
    stop: function(event, ui) { 
     var Stoppos = $(this).position(); 
     var className = $(this).attr("src"); 
     $(".location").text("STOP: \nLeft: "+ Stoppos.left + "\nTop: " + Stoppos.top + className); 
    } 
});