JavaScript判断远程图片是否存在,加载完成:onerror 属性- & jQuery实现(如果因为网络或图片的原因发生异常,则显示该图片)~...
时间: 2024-04-07 15:31:45 浏览: 6
是的,你可以使用JavaScript中的onerror属性和jQuery来判断远程图片是否存在并加载完成。具体实现步骤如下:
1. 使用JavaScript获取需要判断的图片元素,例如:
```javascript
var img = document.getElementById('imgId');
```
2. 给图片元素添加onerror事件,当图片加载出错时会触发该事件:
```javascript
img.onerror = function() {
// 图片加载出错时的处理逻辑
}
```
3. 在事件处理函数中,可以根据需要进行处理,例如显示一张默认图片:
```javascript
img.onerror = function() {
this.src = 'default.jpg';
}
```
4. 使用jQuery可以方便地判断多张图片的加载情况,例如:
```javascript
$('img').on('error', function() {
$(this).attr('src', 'default.jpg');
});
```
这样就可以在页面中加载多张图片时,统一处理加载失败的情况,显示默认图片或其他处理方式。
相关问题
uniapp如何判断css背景图片是否加载完成
在uniapp中,可以使用`uni.getImageInfo`方法来判断图片是否加载完成。该方法可以获取图片信息,包括宽高等属性,如果能够获取到宽高,就说明图片加载完成了。
以下是一个示例代码:
```javascript
uni.getImageInfo({
src: '背景图片的 URL',
success: function (res) {
console.log('背景图片加载完成');
// 在这里执行背景图加载完成后的操作
},
fail: function (res) {
console.log('背景图片加载失败');
// 在这里执行背景图加载失败后的操作
}
})
```
在代码中,我们调用了`uni.getImageInfo`方法,并传入了背景图片的 URL。当图片加载完成时,会执行`success`回调函数,此时可以执行背景图加载完成后的操作。如果图片加载失败,则会执行`fail`回调函数,此时可以执行背景图加载失败后的操作。
JavaScript或jQuery如何判断input标签css属性display是否为none
可以使用jQuery的`.is(":visible")`方法来判断元素是否可见,当元素的`display`属性值为`none`时,该方法会返回`false`。示例代码如下:
```
if ($("input").is(":visible")) {
// 元素可见
} else {
// 元素隐藏
}
```
另外,如果不想使用jQuery,可以使用JavaScript的`getComputedStyle()`方法来获取元素的计算样式,然后判断`display`属性值是否为`none`。示例代码如下:
```
var element = document.querySelector("input");
var style = window.getComputedStyle(element);
if (style.display !== "none") {
// 元素可见
} else {
// 元素隐藏
}
```