图片错误处理函数，基于joomla

最新推荐文章于 2021-03-21 10:05:24 发布

原创最新推荐文章于 2021-03-21 10:05:24 发布 · 350 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jquery #函数

html css 同时被 2 个专栏收录

25 篇文章

订阅专栏

javascript

21 篇文章

订阅专栏

本文介绍了一种使用jQuery实现的图片及背景图错误处理方法。通过正则表达式匹配并替换图片源路径，确保在不同环境下加载正确的资源。适用于前端开发人员。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<script>
   function imgErrorHandling(local_base_host, local_base_path, server_path) {
    var regexp = new RegExp("^(.*" + local_base_host + ")|^(" + local_base_path + ")");
    //img图片错误处理
    jQuery("img").error(function () {
        var img_src, _this = jQuery(this), self_src = _this.attr("src");
        img_src = self_src.replace(regexp, server_path);
        if (!_this.hasClass("img-error")) {
            _this.addClass("img-error");
            _this.attr("src", img_src);
        }
    });
    //背景图片错误处理
    jQuery("[style^='background']").each(function () {
        var bg_src, bgSelf_src = jQuery(this).css("background-image");
        bg_src = bgSelf_src.replace(regexp, server_path);
        jQuery(this).css("background-image", 'url("' + bg_src);
    });

}
jQuery(document).ready(function () {
    var test_host = "192.168.0.100", test_path = "/baidu", server_path = "//www.baidu.com";
    if (window.location.host === test_host) {
        imgErrorHandling("//" + test_host + test_path, test_path, server_path);
    }
});

</script>