html5 load,（HTML5）无法加载我的图片((HTML5) Can't load my image)

(HTML5)无法加载我的图片((HTML5) Can't load my image)

出于某种原因，尽管使用了正确的语法(据我所知)并将图像文件放在与我的HTML文档相同的文件夹中，但当我加载文档时，我编程加载的图像不会出现在页面上。 这里可能是什么问题？

在这里，我的HTML文件显然与我的图像位于同一个文件夹中。

这里是我的代码(这是q3.html )

Question Three

Dominos Pizza order form

我在Macbook Pro上运行它，使用TextEdit作为我的编辑工具。 这是我打开文档后的页面：

For some reason, despite using the right syntax(to my knowledge) and having the image file in the same folder as my HTML document, when I load the document, the image I programmed to load does not appear on the page. What could be the issue here?

Here, my HTML file is clearly in the same folder as my image..

And here is my code (this is for q3.html)

Question Three

Dominos Pizza order form

I am running this on a Macbook Pro, using TextEdit as my editing tool. Here is what my page looks like after I open the document:

原文：https://stackoverflow.com/questions/34953390

更新时间：2020-03-02 07:15

最满意答案

通知“在你的 。 这不是实际的报价。 从而取代“与" 。

因此，新的HTML将如下所示

Question Three

Dominos Pizza order form

Notice “ in your . It is not the actual quotes. Thus replace “ with ".

Thus the new HTML would be as follows

Question Three

Dominos Pizza order form

相关问答

当一些数据被下载时， progress事件被触发， 最多每秒三次。 浏览器通过buffered属性提供可用媒体范围的列表; 媒体缓冲，搜索以及 MDN上的时间范围都有详细的指南。 单负载启动 如果用户不跳过视频，则文件将被加载到一个TimeRange ，并且buffered属性将有一个范围： ------------------------------------------------------

|=============|

...

您不是在等待图像首先完成下载，因此当您的图像尚不可用时，画布将运行其余代码。 强制它首先加载，或者在画布之前使用带有图像src的元素，或者首先创建一个Image()，给它一个onload处理程序，然后设置其src属性，onload处理程序调用你的画布的代码。 you're not waiting for the image to finish downloading first, so the canvas will run through the rest of its code wh

...

您修改imageObj的单个实例; 所以基本上你最终会得到一个指向同一个实例的数组，它以520结尾。 尝试 for (x = 0; x <= 520; x++) {

var imageObj = new Image(); // new instance for each image

imageObj.src = "line_tile/t"+x+".png";

tiles.push(imageObj);

}

Your modifying a single instance

...

使用下面的代码使用jquery预加载图像。

.start_up{width:100%;height:100%;position:fixed;z-index:999;display:none;}

.start_up img{width:100%;height:100%;display:block;}

...

您遇到此行为是因为您在第一个输入中设置了autofocus属性，它会(如名称所示)在页面加载时为其添加焦点 You're experiencing this behavior because of the autofocus attribute you have set in your first input, it will (as the name suggests) add focus to it when the page loads

您可以将图像转换为Base64。 在我的示例中，您请求图像并使用response.blob()将其转换为blob。 一旦它是一个blob，使用fileReader.readAsDataURL来获得Base64。 const fileReader = new FileReader();

fetch("image-resource").then((response) => {

if(response.ok) {

return response.blob();

}

})

...

如果你没有定义EXIF，那么使用var EXIF = require('./exif.js'); FTW。 我设法让这个野兽在没有魔术的情况下工作(快速＆脏的试验和错误结果)： 'use strict';

var EXIF = require('./exif.js');

$(function() {

$('#fileinput').on('change', function(){

var files = this.files,

i=0;

...

您可以分别使用'.load()'和'。play()'手动触发视频加载和播放。 使用'parentElement'定位'source'元素的父元素来完成此任务： $(function() {

$("video.connect-bg source").each(function() {

var sourceFile = $(this).attr("data-src");

$(this).attr("src", sourceFile);

var video = this.pa

...

对于任何仍然感兴趣的人......在重新审视这个问题之后，我遇到了一个名为Lazysizes的相当新的脚本。 它实际上非常通用，但更重要的是它允许我在使用OP中描述的HTML5标记的同时进行延迟加载图像。 非常感谢这个剧本的创作者@aFarkas 。 For anyone still interested... After revisiting this issue, I came across a fairly new script called, Lazysizes. It's actuall

...

通知“在你的 。 这不是实际的报价。 从而取代“与" 。 因此，新的HTML将如下所示

Question Three

Dominos Pizza order form