运行 JavaScript 函数构建 jQuery 时出现问题

Question

我有一个函数

function imageDefer() {
   $('img').each(function(){
      $(this).attr('src', $(this).attr('data-defer'));
   });
}

现在我想以这种方式运行这个函数

$(document).ready(function () {
    imageDefer();
});

这是我的网页

<img src="data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=" data-defer="thumbnail.jpg">

JavaScript和jQuery代码放在单独的.js文件中，但它确实有效。

Answer 1

实际发生的是，当函数超出document.ready范围时，您正在调用函数。

尝试在 document.ready 中声明您的函数：

$(document).ready(function () {
    function imageDefer() {
        $('img').each(function() {
            $(this).attr('src', $(this).attr('data-defer'));
    });
    imageDefer();
});

Answer 2

它对我很有用。我看不出任何问题。确保缩略图.jpg存在，并确保包含代码的.js文件放在jQuery api之后：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script src="file-with-code.js"></script>

杰斯菲德尔：https://jsfiddle.net/mozkomor05/1b7h3cx2/4/

如果仍然无法正常工作，请发送cosole的屏幕截图。