分享更有价值
被信任是一种快乐

jquery如何检查图片是否存在

文章页正文上

这篇文章主要介绍“jquery如何检查图片是否存在”,在日常操作中,相信很多人在jquery如何检查图片是否存在问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”jquery如何检查图片是否存在”的疑惑有所帮助!接下来,请跟着小编一起来学习吧! 一、使用 jQuery 检查图片是否存在我们可以通过 .load() 方法来检测图像是否成功加载。.load() 方法会在所选元素加载完成时触发事件。如果图像成功加载,则会触发 load 事件;否则会触发 error 事件,如下所示:

$('img').on('load',function(){
console.log('Im免费云主机、域名ageisloaded');
}).on('error',function(){
console.log('Imageisnotloaded');
});

在上面的示例中,我们首先选择所有的图片元素,然后监听它们的 load 和 error 事件,在图片成功加载时输出“Image is loaded”,否则输出“Image is not loaded”。二、处理图片不存在的情况当我们检测到图片不存在时,可以通过以下几种方式做出相应处理:显示默认图片在图片不存在的情况下,我们可以在网站中为每个图片添加一个默认的 “暂无图片” 图片。当检测到图片不存在时,我们可以通过修改图片元素的 src 属性来展示默认图片,代码如下:

$('img').on('error',function(){
$(this).attr('src','default.jpg');
});

在上述代码中,当检测到图片不存在时,我们将这个元素的 src 属性修改为 default.jpg,以便展示默认图片。显示图片加载失败提示我们也可以在图片加载失败时,在图片位置展示一个提示文本,提示用户当前展示的图片加载失败。代码如下:

$('img').on('error',function(){
$(this).after('

图片加载失败

'); });

图片加载失败在上述代码中,我们通过 .after() 方法在图片元素后面添加了一个 元素用于展示图片加载失败的提示文本。隐藏图片容器当图片不存在时,我们也可以将它的容器(比如

$('img').on('error',function(){
$(this).parent().hide();
});

在上述代码中,当我们检测到图片不存在时,我们使用 .parent() 方法选择当前图片的父元素,然后使用 .hide() 方法将它隐藏起来。到此,关于“jquery如何检查图片是否存在”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注云技术网站,小编会继续努力为大家带来更多实用的文章!免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@byun.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

相关推荐: react标签不换行如何解决

本篇内容介绍了“react标签不换行如何解决”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!react标签不换行的解决办法:1、对返回的数据中的“n”进行处理,用…

文章页内容下
赞(0) 打赏
版权声明:本站采用知识共享、学习交流,不允许用于商业用途;文章由发布者自行承担一切责任,与本站无关。
文章页正文下
文章页评论上

云服务器、web空间可免费试用

宝塔面板主机、支持php,mysql等,SSL部署;安全高速企业专供99.999%稳定,另有高防主机、不限制内容等类型,具体可咨询QQ:360163164,Tel同微信:18905205712

主机选购导航云服务器试用

登录

找回密码

注册