在javascript中设置背景图像时如何访问本地图像

时间:2015-02-03 23:43:46

标签: javascript html css angularjs image

我的目标是从计算机上的本地图像设置背景图像。

我有两行代码,一行有效,另一行不行: (当地的一个不起作用)

                _html.style.backgroundImage = 'url("urlsourceblahblahblah")';
                _html.style.backgroundImage = 'url("/~/Content/images/Image1.jpg")';

当我尝试运行第二个(本地的)时,这是我得到的错误:

获取http://localhost:23433/~/Content/images/Image1.jpg 404(未找到)

我可以验证图像路径是否正确,即使我将图像文件放在同一目录中也可以使事情变得简单。我从文档中知道JS中的backgroundImage属性需要url()。有什么理由说这不起作用吗?

3 个答案:

答案 0 :(得分:2)

这是一个棘手的问题......我可以想到这可能存在的一些问题:

  1. 服务器不知道〜指的是什么(你在运行Windows吗?)
  2. 运行服务器的用户与您登录的用户不同。 (〜代表主目录,当服务器评估它时,将导致用户运行服务器主目录)。
  3. 服务器配置为忽略其上面的每个请求www / html / localweb文件夹。 (在这种情况下,使用404回复会很奇怪,403会更有意义)
  4. 顺便说一下,只有服务器和客户端在同一台机器上才能实现。我不知道你为什么要这样做,但是如果你假装上传一个网站并将其背景设置在客户端机器上的某个字段上,那么就干脆忘掉它。

答案 1 :(得分:0)

浏览器无法识别您的主目录的~缩写。但是,扩展它只会在图像位于本地主机上的目录中时有所帮助。我不知道您使用的是什么用于Web服务器,但是您需要找出它希望作为其根目录的目录

答案 2 :(得分:0)

您无法引用用户计算机中的图像。浏览器无法访问用户文件系统,否则,您访问的任何网站都可以访问您的"图片"例如文件夹。

您使用的图片需要位于您的网站目录或其他公共网址中。如果您需要使用用户计算机上的图片,那么您应该使用文件上传器。