Javascript JS-（异步）XHR和增量
第一篇文章是这样写的，但事实上是一个长期用户，因为我在这里找到了我需要的一切…直到现在 我在XHR方面遇到了一个棘手的问题。我可能会说我是JS的新手，但我没想到会发生这样的事情，我不能四处走动 所以问题是，我在一个远程服务器上通过一个“for”循环检索一组图像。没问题，它能用。但我想给他们一个id，让他们在“数字”之后使用，这样我就可以在画布中使用它们，并为其设置动画。我不知道问题出在哪里，但是id的增加出错了。这是我的密码：Javascript JS-（异步）XHR和增量,javascript,ajax,xmlhttprequest,blob,increment,Javascript,Ajax,Xmlhttprequest,Blob,Increment,第一篇文章是这样写的，但事实上是一个长期用户，因为我在这里找到了我需要的一切…直到现在 我在XHR方面遇到了一个棘手的问题。我可能会说我是JS的新手，但我没想到会发生这样的事情，我不能四处走动 所以问题是，我在一个远程服务器上通过一个“for”循环检索一组图像。没问题，它能用。但我想给他们一个id，让他们在“数字”之后使用，这样我就可以在画布中使用它们，并为其设置动画。我不知道问题出在哪里，但是id的增加出错了。这是我的密码： <body> <button onclick="
<body>
<button onclick="loadCanvas(113);">Click here</button>
<canvas id="targetedCanvas" width="768" height="512"></canvas>
<script>
window.URL = window.URL || window.webkitURL;
function loadImages() {
for (id = 0; id < 114; id++) {
var url = 'http://myurl.com/IMG_'+id+'.JPG';
var request = new XMLHttpRequest();
request.open('GET', url, true);
request.responseType = 'blob';
request.onload = function(e) {
if(this.status == 200) {
var blob = this.response;
var img = document.createElement('img');
img.id = id;
img.onload = function(e) {
window.URL.revokeObjectURL(img.src);
};
img.src = window.URL.createObjectURL(blob);
img.width = 0;
img.height = 0;
document.body.appendChild(img);
}
}
request.send(null);
};
}
function loadCanvas(id) {
var canvas = document.getElementById('targetedCanvas');
var context = canvas.getContext('2d');
var img = document.getElementById(id);
context.drawImage(img,0,0);
};
loadImages();
</script>
</body>
点击这里
window.URL=window.URL | | window.webkitURL；
函数loadImages（）{
对于（id=0；id<114；id++）{
var url='1〕http://myurl.com/IMG_“+id+”.JPG'；
var request=new XMLHttpRequest（）；
打开（'GET'，url，true）；
request.responseType='blob'；
request.onload=函数（e）{
如果（this.status==200）{
var blob=this.response；
var img=document.createElement（'img'）；
img.id=id；
img.onload=函数（e）{
window.URL.revokeObjectURL（img.src）；
};
img.src=window.URL.createObjectURL（blob）；
img.width=0；
img.height=0；
文件.正文.附件（img）；
}
}
请求发送（空）；
};
}
函数loadCanvas（id）{
var canvas=document.getElementById（'targetedCanvas'）；
var context=canvas.getContext（'2d'）；
var img=document.getElementById（id）；
背景图像（img，0,0）；
};
loadImages（）；
console.log（id）；非常感谢社区 您需要使用一个
自调用函数id function loadImages() {
for (id = 0; id < 114; id++) {
(function(id){
var url = 'http://myurl.com/IMG_'+id+'.JPG';
var request = new XMLHttpRequest();
request.open('GET', url, true);
request.responseType = 'blob';
request.onload = function(e) {
if(this.status == 200) {
var blob = this.response;
var img = document.createElement('img');
img.id = id;
img.onload = function(e) {
window.URL.revokeObjectURL(img.src);
};
img.src = window.URL.createObjectURL(blob);
img.width = 0;
img.height = 0;
document.body.appendChild(img);
}
}
request.send(null);
})(id);
};
}
函数loadImages（）{
对于（id=0；id<114；id++）{
（功能（id）{
var url='1〕http://myurl.com/IMG_“+id+”.JPG'；
var request=new XMLHttpRequest（）；
打开（'GET'，url，true）；
request.responseType='blob'；
request.onload=函数（e）{
如果（this.status==200）{
var blob=this.response；
var img=document.createElement（'img'）；
img.id=id；
img.onload=函数（e）{
window.URL.revokeObjectURL（img.src）；
};
img.src=window.URL.createObjectURL（blob）；
img.width=0；
img.height=0；
文件.正文.附件（img）；
}
}
请求发送（空）；
})（id）；
};
}