onerror javascript 只加载一次?
onerror javascript loads just once?
我一直在努力找出我选择的加载屏幕 on/off 的方式(不是通过自动事件)。
所以我想出了这个解决方案:
css:
#loading {
display: block;
position: absolute;
top: 0;
left: 0;
z-index: 100;
width: 100vw;
height: 100vh;
background-color: rgba(192, 192, 192, 0.5);
background-image: url("http://i.stack.imgur.com/MnyxU.gif");
background-repeat: no-repeat;
background-position: center;
}
javascript:
function loading(action) {
console.log(action);
document.getElementById('loading').style.display = action ? 'block' : 'none';
}
html:
<div id=loading></div>
<img onerror="loading(true)">
// do whatever i need, which takes several seconds to load
<img onerror="loading(false)">
加载屏幕按预期出现,没有任何问题,但是有两件事我不清楚...
- console.log(action) 不起作用...它不会打印任何内容到控制台
- 第二张图片不会关闭加载屏幕...它一直保持打开状态
我做错了什么?
根据@Aioros 的回答,部分正确...
将 src 添加到两个标签后,它会尝试触发 javascript 函数,但是我遇到了错误:loading is not a function 这对我来说毫无意义。
所以我已经替换了:
<img src=blabla onerror="loading(true/false)">
与:
<script>loading(true/false)</script>
现在它工作得很好...
我一直在努力找出我选择的加载屏幕 on/off 的方式(不是通过自动事件)。 所以我想出了这个解决方案:
css:
#loading {
display: block;
position: absolute;
top: 0;
left: 0;
z-index: 100;
width: 100vw;
height: 100vh;
background-color: rgba(192, 192, 192, 0.5);
background-image: url("http://i.stack.imgur.com/MnyxU.gif");
background-repeat: no-repeat;
background-position: center;
}
javascript:
function loading(action) {
console.log(action);
document.getElementById('loading').style.display = action ? 'block' : 'none';
}
html:
<div id=loading></div>
<img onerror="loading(true)">
// do whatever i need, which takes several seconds to load
<img onerror="loading(false)">
加载屏幕按预期出现,没有任何问题,但是有两件事我不清楚...
- console.log(action) 不起作用...它不会打印任何内容到控制台
- 第二张图片不会关闭加载屏幕...它一直保持打开状态
我做错了什么?
根据@Aioros 的回答,部分正确... 将 src 添加到两个标签后,它会尝试触发 javascript 函数,但是我遇到了错误:loading is not a function 这对我来说毫无意义。
所以我已经替换了:
<img src=blabla onerror="loading(true/false)">
与:
<script>loading(true/false)</script>
现在它工作得很好...