设置为javascript时，Chrome不会加载img src [英] Chrome is not loading img src when set in javascript
问题描述
当用户点击FORWARD或BACK时，我有一个相册循环浏览一系列图片，通过Javascript实现设置img的src。它适用于FF，Opera，IE和Safari，但不适用于Chrome - 在Chrome中，图像有时会出现，有时甚至是空白区域。看起来，如果图像缓存，它们是可见的，但如果它们尚未加载Chrome浏览器不加载它们。我已经确认src在元素中正确设置，它只是不显示。
如果图像加载到页面的html中，它们会在显示时正确显示.src在javascript中设置，但如果它们不在加载的HTML代码中，那么它们中的一些将显示出来，有些则不会 - 但只有在Chrome中，在所有其他浏览器中，它才能正常工作。
是否有一些我需要用于Chrome的缓存设置，或者我可以做些什么来确保这些缓存设置已正确加载？
感谢所有。
罗素
（已添加）以下是一些代码。它被生成，这是奇怪的常量来自哪里，并且该文件继续有几百个< li> elements
< HTML>
< HEAD>
< link href =../ lame.css =stylesheettype =text / css>
< TITLE> Young / Haraske幻灯片< / TITLE>
< script src =../ lame.js>< / script>
< script>
var int2atts = []，int2path = []，paths = {}，atts;
atts = {}
int2atts [36] = atts;
int2path [36] =家庭/年轻人/罗素
window.onload = function（）{substituteNodeInfo（）; showPage（254）;}
var imagePtr = 0;
function nextImage（i）{
imagePtr =（imagePtr + i + 254）％254;
var nextSrc = document.getElementById（photo+ imagePtr）.src
var mainImage = document.getElementById（MainImage）;
var src = mainImage.src;
mainImage.src = src.substring（0，src.lastIndexOf（/））+ nextSrc.substring（nextSrc.lastIndexOf（/））;
返回false;
}
< / script>
< / HEAD>
< BODY id =pathBody>
< H1 id =pageTitle> Russell< / H1>
< div>
< img id =MainImagesrc =../ pictures / 1845DEC61.JPG>< / img>
< h3 id =标题>罗素< / h3>
< div id =Text>< / div>
< a href =onclick =return nextImage（-1）>上一个< / a>
< a href =onclick =return nextImage（1）>下一步< / a>
< p />
此过滤器包含在以下路径中：
< ul class =paths>
< li class =path>< a href =../ folders / Russell.html？path = 36> Family / Young / Russell< / a>< /立GT;
< / ul>
< / div>
< div class =choosePage>< / div>
< ul id =galleryclass =filteredItems>
< li id =listing0class =lineblock>< p>
< a class ='folder'href =../ items / 1845DEC61.html>
< img id =photo0src ='.. / thumbnails / 1845DEC61.JPG'alt ='1845DEC61.JPG'>
< br />图片页面< / a> /< a href =../ fullsize / 1845DEC61.JPG>完整尺寸< / a>
< br /> 1845DEC61.JPG
< / li>
< li id =listing1class =lineblock>< p>
< a class ='folder'href =../ items / 1669.html>
< img id =photo1src ='.. / thumbnails / 1669.JPG'alt ='1669.JPG'>
< br />图片页面< / a> /< a href =../ fullsize / 1669.JPG>完整尺寸< / a>
< br /> 1669.JPG
< / li>
缓存显然已被清除。网络选项卡显示chrome认为它正在从缓存加载图像，当我尝试清除缓存一切工作。可能这是一个错误，缓存正在清理，但索引不更新？
感谢您的建议。
I have a photo album which cycles through a series of images when the user clicks on FORWARD or BACK, implemented by Javascript setting the src of an img. It works properly on FF, Opera, IE, and Safari, but not in Chrome - in Chrome the images sometimes appear and sometimes are blank space. It appears if the images are cached they are visible, but if they have not been loaded already Chrome does not load them. I have confirmed the src is being set correctly in the element, it just is not displaying.
If the images are loaded in the html for the page they show up properly when .src is set in javascript, but if they are not in the loaded html code then some of them will show up and some will not - but only in Chrome, in all other browsers it appears to work properly.
Is there some cache setting I need to use for Chrome, or a hack I can do to make sure these are loaded properly?
Thanks to all.
russell
(Added) Some code follows. It is generated, which is where the strange constants come from, and the file continues with a couple hundred more < li > elements
<HTML>
<HEAD>
<link href="../lame.css" rel="stylesheet" type="text/css">
<TITLE>Young/Haraske slides</TITLE>
<script src="../lame.js"></script>
<script>
var int2atts = [], int2path = [], paths = {}, atts;
atts = {}
int2atts[36] = atts;
int2path[36] = "Families/Young/Russell"
window.onload = function() {substituteNodeInfo(); showPage(254);}
var imagePtr = 0;
function nextImage(i) {
imagePtr = (imagePtr + i + 254) % 254;
var nextSrc = document.getElementById("photo" + imagePtr).src
var mainImage = document.getElementById("MainImage");
var src = mainImage.src;
mainImage.src = src.substring(0, src.lastIndexOf("/")) + nextSrc.substring(nextSrc.lastIndexOf("/"));
return false;
}
</script>
</HEAD>
<BODY id="pathBody">
<H1 id="pageTitle">Russell</H1>
<div>
<img id="MainImage" src="../pictures/1845DEC61.JPG"></img>
<h3 id="Title">Russell</h3>
<div id="Text"></div>
<a href="" onclick="return nextImage(-1)">Previous</a>
<a href="" onclick="return nextImage(1)">Next</a>
<p />
This filter is included in the following paths:
<ul class="paths">
<li class="path"><a href="../folders/Russell.html?path=36">Families/Young/Russell</a></li>
</ul>
</div>
<div class="choosePage"></div>
<ul id="gallery" class="filteredItems">
<li id="listing0" class="lineblock"><p>
<a class='folder' href="../items/1845DEC61.html">
<img id="photo0" src='../thumbnails/1845DEC61.JPG' alt='1845DEC61.JPG'>
<br />Image page</a>/<a href="../fullsize/1845DEC61.JPG">Full size</a>
<br />1845DEC61.JPG
</li>
<li id="listing1" class="lineblock"><p>
<a class='folder' href="../items/1669.html">
<img id="photo1" src='../thumbnails/1669.JPG' alt='1669.JPG'>
<br />Image page</a>/<a href="../fullsize/1669.JPG">Full size</a>
<br />1669.JPG
</li>
Cache is apparently being cleared out. Network tab shows chrome thinks it is loading the image from cache, when I tried clearing cache everything worked. Possibly this is a bug, where cache is being cleaned out but the index is not updated?
Thanks for the suggestions.
这篇关于设置为javascript时，Chrome不会加载img src的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
