首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

有没有办法一旦img src标记被新的src替换,调用就不会转到旧的src?

有一种方法可以防止img src标记在被新的src替换后调用旧的src,就是在给img元素设置新的src之前,先将该img元素设置为不可见,然后再修改src属性,并在新的src加载完毕后,再将img元素设置为可见。

下面是一个示例代码,用于实现上述的逻辑:

代码语言:txt
复制
<img id="myImage" src="old_image.jpg" style="display: none;">
<script>
    var img = document.getElementById("myImage");
    var newSrc = "new_image.jpg";
    
    // 设置新的src之前,将img元素设置为不可见
    img.style.display = "none";
    
    // 修改src属性为新的src
    img.src = newSrc;
    
    // 监听新的src加载完成的事件
    img.addEventListener("load", function() {
        // 加载完成后,将img元素设置为可见
        img.style.display = "block";
    });
</script>

上述代码中,我们通过将img元素的display样式属性设置为"none"来将其隐藏。然后,我们修改img元素的src属性为新的src。最后,通过监听img元素的load事件,在新的src加载完成后,将img元素的display样式属性设置为"block",使其恢复可见。

这种方法可以确保在新的src加载完成之前,不会显示旧的src,从而实现了一旦img src标记被新的src替换,就不会转到旧的src的效果。

在腾讯云的产品中,推荐使用腾讯云对象存储(COS)来存储和管理图片资源。腾讯云对象存储(COS)是一种高可用、高可扩展的云存储服务,适用于图片、音视频、文件等数据的存储和分发。您可以通过腾讯云对象存储(COS)来存储新的图片资源,并在需要时通过修改img元素的src属性来切换到新的图片资源。

您可以通过以下链接了解更多关于腾讯云对象存储(COS)的信息: https://cloud.tencent.com/product/cos

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券