Jquery惰性加载无法与Jquery datatable一起正常工作

我正在尝试使用jquery datatable添加jquery延迟加载。但问题发生在数据进入分页页面时，jquery延迟加载无法处理其他页面图像

@foreach($products as $product)
                            <tr>
                                <td>{{$i++}}</td>
                                <td width="10%">
                                    <img width="90%" class='lazy' data-src="/storage/{{explode(',',$product->images)[0]}}">
                                </td>
                                <td>{{$product->p_name}}</td>
                                <td>{{$product->sku}}</td>
                                <td><b>{{$product->currency == "dollar"?'$':$product->currency}}</b>{{$product->price}}</td>
                                <td>{{$product->quantity}}</td>
                                <td>{{$product->active == true?'Enable':'Disable'}}</td>
                                <td>
                                    <a href="{{route('product.show', $product->id)}}" class="btn btn-small waves-effect"><i class="material-icons">arrow_forward</i></a>
                                </td>
                            </tr>
@endforeach

@section('js')
<script src="{{asset('plugins/datatable/jquery.dataTables.min.js')}}"></script>
<script src='{{asset('plugins/jquery/jquery.lazy.min.js')}}'></script>
<script>
    $(document).ready(function () {
        $("#table").dataTable();
        $('select').formSelect();
    });
    $(function() {
        $('.lazy').lazy();
    });
</script>

@foreach（$products作为$product）
{{$i++}
图像）[0]}“>
{{$product->p_name}
{{$product->sku}
{{$product->CURRENY==“美元”？“$”：$product->CURRENY}{{{$product->price}}
{{$product->QUOTE}
{{$product->active==true？'Enable'：'Disable'}
@endforeach
@节（'js'）
$（文档）.ready（函数（）{
$（“#表”）.dataTable（）；
$（'select'）.formSelect（）；
});
$（函数（）{
$（'.lazy'）.lazy（）；
});

@端部

Jquery数据表第一页

Jquery数据表第二页

---

您需要向数据表添加回调选项，如：

$("#table").dataTable({
    drawCallback: function(settings){
        $('.lazy').lazy();
    }
});