創建一個圖像，無論哪裏有人點擊 - .append結合pageX和Pagey

Question

我想創建一個智能手機（iOS和Android）上的交互，創建一個圖像，無論有人在屏幕上點擊。使用jQuery Mobile的，這是JS我現在所擁有的：

$('#container1').bind('tap', function(e) { 
$('img').css({ 
    position: 'absolute', 
    left: e.pageX, 
    top: e.pageY 
}); 
$("#container1").append('<img src="image.png" />'); 
}); 

然而，這造成了圖像的情況下，保持堆疊它們無論用戶在哪裏水龍頭。如果有人用獨特的X和Y位置進行點擊，我該如何組合這兩個代碼塊來創建同一圖像的獨特實例？謝謝！

Answer 1

您的代碼

$('img').css({ 
    position: 'absolute', 
    left: e.pageX, 
    top: e.pageY 
}); 

正在改變頁面上的所有img標籤的位置。您可能需要手動設置您添加的圖片樣式屬性：

$('#container1').bind('tap', function(e) { 
    var image = '<img src="image.png" style="position:absolute;left:' + e.pageX + 
     ';top:' + e.pageY';" />'; 
    $("#container1").append(image); 
}