Question

我想阻止网页上的所有图片。将有灰色框而不是图像。

与延迟加载一样，但图像会在滚动时不加载。

我如何用jquery做到这一点？这有什么功能吗？

Answer 1

 $('img').attr('src', 'img_with_square_border.jpg');

这应该完美无缺。

...当然，除非您想在用户到达时加载图像。

编辑以进行点击

$('img').each(function () { this.setAttribute('real-src', this.src); })
        .attr('src', 'whatever.jpg')
        .click(function () { this.src = this.getAttribute('real-src'); });

Answer 2

以下是使用灰色框替换图像的示例，并使用.data()保留对原始图像的引用。

示例:: http://jsfiddle.net/GTQTC/2/ （将在3秒后恢复）

$('img').each(function() {
    var $th = $(this);
    var div = $('<div>', {
        className: 'replacement',
        width: $th.width(),
        height: $th.height(),
        display: $th.css('display'),
        css:{'backgroundColor':'#DDD'}
    })
        .data('originalImage',this);
    $th.replaceWith(div);
});

setTimeout(function() {
    $('.replacement').replaceWith(function() {
        return $(this).data('originalImage');
    });
}, 3000);

如何使用Jquery阻止图像加载

2 个答案: