0

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

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 的动态生成的图像有问题吗？

谢谢

4

2 回答 2

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>

我还可以建议其他两项修改：

  1. 您的 URL 中的图像参数应该是 URL 编码的
  2. 使用起来更整洁，$(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>
于 2012-09-26T10:01:51.397 回答
1

使用以下代码，它应该可以工作：

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

您忘记应用 url() 来添加背景图像。

于 2012-09-26T10:03:10.863 回答