jquery - 在 append 函数中定义图像样式

Question

我有一张图片，我想在右击 div 的位置显示在 div 上。我无法这样做可能是因为我以不正确的方式添加样式。我还在 Web 控制台中看到一条错误消息:“在属性列表之后缺少 }”，如下所示。谁能帮我解决这个问题。这是我试图将图像附加到右键单击位置上的 div 的行

$("#Boma").append($("<img>", {"src": "Boma.png" ,"style": width:25px; height:20px; position:absolute; left:xCoord; top:yCoord;}))

我已将右键单击坐标存储在 xCoord 和 yCoord 中的另一个函数中，它们是我代码中的全局坐标。

Answer 1

为此，您可以将 style 放在单个字符串中，确保正确连接变量:

$('<img />', { 
  'src': 'Boma.png',
  'style': 'width: 25px; height: 20px; position: absolute; left: ' + xCoord + '; top: ' + yCoord + ';'
}).appendTo('#Boma');

或者，您可以在您创建的 img 元素上单独调用 css() 方法:

$('<img />', { 'src': 'Boma.png' }).css({
  width: '25px',
  height: '20px',
  position: 'absolute',
  left: xCoord, 
  top: yCoord 
}).appendTo('#Boma');

顺便说一句，我强烈建议您使用类来尽可能多地设置样式。在您的示例中，应该可以仅内联 top 和 left 规则。