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);
}

创建图像，无论有人点击 - .append与pageX和Pagey结合使用

1 个答案: