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

我有一个外部Javascript页面，位于父文件夹的

。/Scripts/CBox/

下。 同一文件夹中有一个图像。我想从那里使用Jquery为控件设置

背景图像

。当我使用此代码时，它将

背景图像

路径设置为

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);
}

尝试：

---

你最好这样做：

CSS

.my-background {
    background-image: url("ddl_arrow.png");
    background-repeat: no-repeat;
    background-position-x: 99%;
    background-position-y: -2px;
}

JQuery

$(boxCtrl).addClass('my-background');

CSS将始终理解从自身到图像文件夹的路径，因此如果您的结构是：

/images
/css

背景图像路径应为：

../images/ddl_arrow.png

使用

。

向上提升一级，然后进入同级目录

images

以获取文件。你可以把它放在任何地方，它会起作用的

值得注意的是，对样式使用css而不是在JQuery中添加样式更易于重用（只需在需要的HTML中添加

.my background

）。由于功能文件中没有样式信息，因此维护起来也更方便一些——未来的你（或你的队友）会为此感谢你

而且，

background-position-x

/

background-position-y

是，因此不能到处依赖

background-position:x-value-y-value

现在更好。

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

只有几种方法可以解决这个问题，所有这些方法都基于相同的原则：正确地组织文件——每个资源都应该是一个URL。想一想：如果你不知道

ddl_arrow.png

存储在哪里，浏览器也不能

我认为最好的解决方案是将所有图像从服务器根目录放到[img]文件夹中。这意味着您可以通过以下方式引用图像：

url（/img/ddl\u arrow.png）

。无论哪个JS、哪个CSS或HTML文件需要这些图像，请确保它们始终使用前面的斜杠引用这些图像。当然，这不仅适用于图像，还适用于所有其他资产/资源—字体、视频、音频，甚至HTML、CSS、JS文件本身。基本上，服务器提供的每个文件都应该以这种方式引用

---

还有其他一些骇客涉及到肮脏、混乱的东西，比如使用服务器端脚本打印JS文件的位置，该文件正被提取到JS文件中，但我建议远离这些方法。

我正在尝试将CBox作为一个可再发行的控件。因此，无法使用确切的文件夹名称。我将在找到其他文件夹名称时返回到此文件夹。

../images/ddl_arrow.png