javascript - 使用 jquery 脚本页面从当前文件夹设置 css 图像

Question

我有一个外部 Javascript 页面位于父级的 ../Scripts/CBox/ 文件夹下。 同一文件夹中有一张图片。我想从那里使用 Jquery 为控件设置 background-image 。当我使用这段代码时，它将 background-image 路径设置为 localhost:7905/ddl_arrow.png 其中 localhost:7905 是我的 asp。 net 开发服务器。

 function createAutoCBox(boxCtrl) {

    $(boxCtrl).css('background-image', 'url("ddl_arrow.png")'); 
    $(boxCtrl).css('background-repeat', 'no-repeat');
    $(boxCtrl).css('background-position-x', '99%');
    $(boxCtrl).css('background-position-y', '-2px'); 
    $(boxCtrl).mousemove(jqAutoCompleteMouseMove);
    $(boxCtrl).keyup(jqAutoCompleteKeyUp);
    $(boxCtrl).mousedown(jqAutoCompleteMouseDown);
}

Answer 1

没有办法“获取当前脚本在服务器上的路径”，因为 JS 是在客户端完成的。所以没有简单的方法来做你想做的事。

解决这个问题的方法只有几种，而且所有方法都基于相同的原则:正确组织文件 - 每个资源都应该是一个 URL。想一想:如果您不能可靠地判断 ddl_arrow.png 的存储位置，浏览器也不能。

我认为最好的解决方案是将所有图像放在服务器根目录下的 [img] 文件夹中。这意味着您可以通过以下方式引用图像:url(/img/ddl_arrow.png)。无论哪个 JS、哪个 CSS 或 HTML 文件需要图像，请确保它们始终使用前面的斜线引用图像。当然，这不仅适用于图像，还适用于所有其他 Assets /资源——字体、视频、音频，甚至 HTML、CSS、JS 文件本身。基本上，您的服务器提供的每个文件都应该以这种方式引用。

还有其他涉及讨厌、困惑的东西的黑客攻击，比如使用服务器端脚本打印 JS 文件的位置，这些文件被直接提取到 JS 文件中，但我建议远离这些方法。