Question

我想使用Lazy Load，它需要一个名为“data-original”的属性，该属性指向原始图像的src值。我可以使用src attr中的值创建新的“data-original”，没有问题：

  $('img.lazy').each(function() {
    a =  $(this).attr("src");
        $(this).attr("data-original", a);
   });

但是，如果我遵循这个（Lazy Load需要src值）：

  $('img.lazy').each(function() {
    b =  "img/grey.gif";
        $(this).attr("src", b);
   });

data-original和src atrr都变为“img / grey.gif”

感谢新手！

Answer 1

你可以将两者放在同一个循环中。甚至认为这可能不是问题，如果您没有使用名为a的全局变量，通常应该使用“var a = ...”。

$('img.lazy').each(function() {
   $(this).attr("data-original", $(this).attr("src"));
   $(this).attr("src", "img/grey.gif");
});

Answer 2

出于安全原因，使用jQuery .attr()方法，某些（或可能是所有？）浏览器不允许更改DOM元素的某些属性。如果是这种情况，您可以使用以下方法。

$('img.lazy').each(function() {
    $(this).attr("data-original",$(this).attr("src"));
    $(this)[0].src = "img/grey.gif";
    // or $(this).get(0).src = "img/grey.gif";
});

<强> [编辑]

切换订单：

$('img.lazy').each(function() {
    var src = $(this).attr("src");
    // assign the initial src value to temp var
    $(this)[0].src = "img/grey.gif";
    // or $(this).get(0).src = "img/grey.gif";
    $(this).attr("data-original",src);
});

我不熟悉Lazy Load。它可能会替换元素而不是更改其属性值。如果是这种情况，那么您将需要采取不同的路径。

[结束编辑]

我不确定这是不是你的问题。

如何基于img src创建新属性并将原始src值用于另一个？

2 个答案: