Question

<body style="background-color: paleturquoise">
    <h2 style="color: red">Duke's soccer League: Home Page<br/></h2>
    <ul style="list-style-type: circle">
        <li style="font-size: larger"><a href="league_list.in">All Leagues list</a></li>
        <li style="font-size: larger">Register for a League (TBA)<br/><br/></li>
    </ul>
    <h2 style="color: red">League Administrator</h2>
    <ul style="list-style-type: square">
        <li style="font-size: larger"><a href="add_league.in">Add a new League (TBA)</a></li>

        <img  src="C:\Users\VIRK\Desktop\66.jpg" width="400" height="400" ></img>

</ul>
</body>

我目前正在使用JSP，我尝试使用这个html代码在NetBeans IDE 7.0上创建一个网页，但是当我构建并运行页面时，代码中没有错误，但图像没有显示在浏览器中。

已编辑：

enter image description here

在这里，我给出了NetBeans IDE的屏幕截图，您可以在其中看到图像存在于Web-INF文件夹和index.jsp页面中，我尝试使用"/"之前的图像名称，但它赢了“工作。我的项目的确切路径是C：\ Users \ VIRK \ Documents \ NetBeansProjects \ practiceJSP。

<img  src="/66.jpg" width="400" height="400" ></img>

Answer 1

我找到了如何设置图片路径的方法，只需将目标文件夹前的"/"删除为"images/66.jpg"而不是"/images/66.jpg"并且它对我来说很好。

Answer 2

您将img标记物理路径放入您的图像中。而不应该将虚拟路径（根据Web应用程序的根目录）添加到您的映像中。此值取决于图像的位置和html页面。

例如，如果你有：

/yourDir
-page.html
-66.jpg

你的page.html中的

应该是这样的：

<img  src="66.jpg" width="400" height="400" ></img>

第二种情况：

/images
-66.jpg
/html
page.html

所以你的img应该是这样的：

<img  src="../images/66.jpg" width="400" height="400" ></img>

Answer 3

我不知道您在计算机上运行网站的位置，但是您有一个C驱动器的绝对文件路径：C：\ Users \ VIRK \ Desktop \ 66.jpg

请改为尝试：

<img  src="[PATH_RELATIVE_TO_ROOT]/66.jpg" width="400" height="400" />

<强>更新

我不知道你的$PROJECTHOME是什么。但是比如说您的站点文件位于C：\ Users \ VIRK \ MyWebsite。并且假设您的图像位于主站点的“图像”文件夹中，如下所示：C：\ Users \ VIRK \ MyWebsite \ images。

然后在您的HTML中，您可以简单地引用图像文件夹中相对于网站的图像，如下所示：

<img  src="images/66.jpg" width="400" height="400" />

或者，假设您在localhost的根目录而不是在另一个虚拟目录中，您可以这样做（请注意开头的斜杠）：

<img  src="/images/66.jpg" width="400" height="400" />

Answer 4

你的路径应该是这样的：“http：//websitedomain//folderpath/66.jpg”＆gt;

<img  src="http://websitedomain/folderpath/66.jpg" width="400" height="400" ></img>

Answer 5

您需要做的就是右键单击浏览器中的jsp页面，该页面可能看起来像“localhost：8080 / images.jpg，将其复制并粘贴到生成图像的位置

Answer 6

我在Netbeans中遇到了同样的问题。

我更新了项目中的图像位置，当我执行jsp文件时，图片没有加载到页面中。

然后我清理并在Netbeans中构建项目。然后它工作正常。

虽然您需要使用浏览器中的图片网址检查图片是否存在。

Answer 7

我遇到了图像无法显示的问题，并且它不是相对路径。我甚至硬编码实际路径，图像仍然没有显示。我已将我的网络服务器更改为在端口8080上运行，而不是

<img src="c:/public/images/<?php echo $image->filename; ?>" width="100" />
<img src="c:/public/images/mypic.jpg" width="100" />

无效。

<img src="../../images/<?php echo $photo->filename; ?>" width="100" />

也没用。这确实有效：

<img src="http://localhost:8080/public/images/<?php echo $image->filename; ?>" width="100" />

Answer 8

不要将* jsp或* html放在webapp的根文件夹中，而要在同一根文件夹浏览器中显示的图像不能访问WEB-INF文件夹中的图像

Answer 9

我也有类似的问题并尝试了以上所有但没有任何效果。然后我注意到图像正在加载一个文件而不是另一个文件。原因是：我的图像被命名为image.jpg，而一个名为about.html的页面无法加载，而login.html可以。这是因为image.jpg低于大约和高于登录名。所以我想login.html可以参考图像而about.html找不到它。我将about.html重命名为zabout.html并重新重命名。工作。包含在文件夹中的图像可能就是这种情况。

Answer 10

通过简单的方法将图像放入Web内容然后右键单击它然后通过eclipse或net beans web浏览器打开它它将显示页面，您可以在其中看到URL，这是确切的路径然后复制URL并将其放在src =＆＃34;粘贴网址＆＃34; ;

Answer 11

如果我们使用asp.net“FileUpload”控件并希望在上传之前预览图像，我们可以使用下面的代码。

<asp:FileUpload ID="fileUpload" runat="server" Style="border: none;" onchange="showpreview(this);" />
<img id="previewImage" src="C:\fakepath\natureImage.jpg">


<script>
    function showpreview(Imagepath) {
        var reader = new FileReader();
        reader.onload = function (e) {
            $("#previewImage").attr("src", e.target.result);
        }
        reader.readAsDataURL(Imagepath.files[0]);
    }
</script>

Answer 12

图片无法显示的另一个随机原因是由于base href="http://..."的存在，它可以使images文件无法正常工作。删除该行，您应该会很好。

Answer 13

您需要从图像文件夹中导入图像。 import name_of_image from '../imageFolder/name_of_image.jpg';

<img src={name_of_image} alt=''>

请参考这里。 https://create-react-app.dev/docs/adding-images-fonts-and-files -

Answer 14

路径中的文件夹名称不能包含空格

写 fullstack /asset/image.jpg 而不是 full stack/asset/image.jpg

图片没有在浏览器中显示？

14 个答案: