如何停止从dataTable中的上一页加载数据？

makkasi 发表于 Dev

马卡西

我通过这种方式使用真正的分页：

<p:dataGrid  var="p" widgetVar="imagesDataGrid"
             value="#{pictureMB.tableDataModel}"
             columns="3"
             rows="12"
             paginator="true" 
             id="dgPictures"
             paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}" 
             rowsPerPageTemplate="12,24,48"
             lazy="true" >

我想要的是，当我选择第二页时，要停止用于第一页的所有请求（当前它们继续，因为有太大的文件无法快速下载）。

当前，当我选择第二页时，第一页上的图片数据仍会下载，第二页的速度变慢，并且由于连接繁忙而无法启动它的请求。请帮忙！

BalusC

您无法停止浏览器下载图像。最好的选择是不要<img src>直接使用，而是将控件委派给JavaScript，一旦最终用户滚动到JavaScript，JavaScript便可以延迟加载图像。您可以抓住jQuery Lazyload插件。它只会加载浏览器视口中可见的图像，而不加载低于滚动阈值的图像。另请参阅演示。

如果您已将jquery.lazyload.min.js文件放在文件WebContent/resources/scripts夹中，这是一个用法示例：

<h:body>
    <h:outputScript name="scripts/jquery.lazyload.min.js" target="head" />
    <h:outputScript target="body">$("img.lazy").lazyload();</h:outputScript>
    ...
    <p:dataTable ... var="picture">
        <p:column>
            <img class="lazy" data-original="#{picture.url}" 
                width="#{picture.width}" height="#{picture.height}" />
        </p:column>
    </p:dataTable>
</h:body>

请注意，<h|p:graphicImage>不适用于该作业，因为src当您需要设置属性时，它将始终自动生成data-original属性。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。