Question

我正在使用带有查询字符串参数的网址生成一些缩略图，例如：

http://localhost:7229/GenerateImage.ashx?image=/media/map-v2.png&width=320&height=200

我试图使用jquery：

将此图像分配给元素的背景

<div id="myDiv"></div>

<script type="text/javascript">
  $(document).ready(function() {
    $('#myDiv').css("background-image", "http://localhost:7229/GenerateImage.ashx?image=/media/map-v2.png&width=320&height=200");
  });
</script>

但是图像没有显示。当我将url输入浏览器窗口时，它会按预期返回图像..但出于某种原因，我无法使用jquery将其指定为背景图像。

有没有人知道我在这里做错了什么？使用css动态生成的图像是否有问题？

由于

Answer 1

这应该有效，你没有使用正确的背景图像语法：

<script type="text/javascript">
  $(document).ready(function() {
    $('#myDiv').css("background-image", "url(http://localhost:7229/GenerateImage.ashx?image=/media/map-v2.png&width=320&height=200)");
  });
</script>

我还建议另外两个修改：

您网址中的图片参数应为网址编码
使用$(function(){})代替$(document).ready(function(){})

所以以下是重写：

<script type="text/javascript">
  $(function() {
    $('#myDiv').css("background-image", "url(http://localhost:7229/GenerateImage.ashx?image=%2Fmedia%2Fmap-v2.png&width=320&height=200)");
  });
</script>

Answer 2

使用以下代码：

$('#myDiv').css("background-image", "url(http://localhost:7229/GenerateImage.ashx?image=/media/map-v2.png&width=320&height=200)");

您忘记应用网址（）来添加背景图片。

Jquery .css和动态生成的图像？

2 个答案: