CSS背景URL是否可以传递一个动态查询字符串,如果可以,如何传递?

CSS背景URL是否可以传递一个动态查询字符串,如果可以,如何传递?,css,background,Css,Background,是否可以向url属性传递动态查询字符串?例如url(./SOME\u IMAGE\u GENERATOR?IMAGE=1)图像在哪里变化 我需要通过JS设置此属性: $( "#elem" )[ 0 ].style.background = "url( ./renders/circuit.php?circuit=" + dirY + dirX + "&dims=1|1 )"; url中的链接指向生成并返回图像的文件。 正确生成图像,但不作为背景应用 澄清 我想放进去的图像还不存在。它由页

是否可以向
url
属性传递动态查询字符串?例如
url(./SOME\u IMAGE\u GENERATOR?IMAGE=1)图像在哪里变化

我需要通过JS设置此属性:

$( "#elem" )[ 0 ].style.background = "url( ./renders/circuit.php?circuit=" + dirY + dirX + "&dims=1|1 )";
url
中的链接指向生成并返回图像的文件。 正确生成图像,但不作为背景应用

澄清

我想放进去的图像还不存在。它由页面
circuits.php
生成并返回,具体取决于参数

如果图像存在,背景会发生很好的变化。我注意到,与
img
标记的
src
属性不同,当参数通过浏览器创建请求、发送和接收标题和信息时,
background
不会

我曾考虑过向
circuit.php
生成器发送一个请求,让他将图像保存在服务器上,然后使用
setTimeout
更改背景,但我不能依赖于特定的生成时间


这就是问题所在。现在,你们有什么想法可以超越它吗?

是的,可以使用CSS将即时图像设置为背景图像

这与您如何为
img
元素使用即时图像没有什么不同。

您使用jQuery吗? 这应该很容易做到

将生成的图像url存储在变量中,然后使用jQuery更改CSS背景图像值,如下所示:

这里有一个JSFIDLE演示了这个概念。单击
div
查看通过JS动态更改的背景图像。

工作示例 我在自己的网站上用一个JSFIDLE和一个图像生成脚本复制了您的场景

如您所见,确实可以使用生成的图像动态更改背景:

调试代码 那么…你的怎么了? 首先,如果你使用的是Firefox或Chrome,请使用开发者工具来检查发生了什么。确保控制台中没有显示Javascript错误

然后我建议您检查您的javascript是否实际选择了元素,以及它是否能够更改背景(比如静态图像)。隔离给您带来问题的代码,并在一个新的空白页面中进行测试,有点像我上面链接的JSFIDLE

另一方面,我觉得你的javascript代码有点陌生

而不是:

尝试使用:


最后,请确保在生成图像的php脚本中设置了正确的标题,并且在设置标题之前不会发生任何输出。

向我们展示相关的CSS,因此,您的问题有一定的背景。您是否尝试过
style.backgroundImage
?@MrSlayer我已经更新了主题,您能否将带有工作参数的链接发布到该图像生成器,以用于测试解决方案?(满满的)url@DigitalBiscuits该文件位于我的本地服务器上。对于工作参数,它返回一个22x22像素的png文件,对于其他情况,它返回一个相同大小的空白透明文件。那是我自己的剧本<代码>$
非常舒适=)请阅读主题更新。我真的不知道,为什么,但当我提供完整路径时(包括“http://...)成功了。在你发布之前,我已经试过了你在debuggin中写的所有东西。在我的脚本
$(“#elem”)[0]==document.getElementById('elem')
中的备注。不管怎样,你的回答解决了问题。V+1。P.P.S可能,当地址以本地方式提供时,例如“/renders/…”浏览器会在本地目录中查找,并避免发送标题。我猜,完整路径会使浏览器打开HTTP请求。这很有趣。多么有趣……只要它现在起作用,我想这是最重要的。很高兴我能帮你找到答案。
var imageUrl = "./renders/circuit.php?circuit=" + dirY + dirX + "&dims=1|1";
$('#myDiv').css('background-image', 'url(' + imageUrl + ')');
$( "#elem" )[ 0 ].style.background = ...
document.getElementById('myImg').style.background = ...