Question

编辑 - 用于查看问题http://syndex.me

的网址

我正在动态调整大于浏览器的图像大小，以等于浏览器的大小。

这不是一件容易的事，因为我们不得不先等待图像加载，以便首先检查图像是否大于窗口。

我们到了这个阶段（有效）：

var maxxxHeight = $(window).height();

$(".theImage").children('img').each(function() {
    $(this).load( function() { // only if images can be loaded dynamically
        handleImageLoad(this);
    });
    handleImageLoad(this);
});

function handleImageLoad(img)
{
    var $img = $(img),  // declare local and cache jQuery for the argument
        myHeight = $img.height();
    if ( myHeight > maxxxHeight ){
        $img.height(maxxxHeight);
        $img.next().text("Browser " + maxxxHeight + " image height " + myHeight);
    };
}

问题是，页面是无限滚动（I'm using this）我知道你无法将'live'附加到'each'作为'live'处理事件，并且'each'不是事件。

我查看了livequery plugin之类的内容并使用了ajaxComplete函数。

使用livequery我改变了

$（“。theImage”）。children（'img'）。each（function（）{

到

$（“。theImage”）。children（'img'）。livequery（function（）{

但那没用。

ajaxComplete似乎什么也没做，所以我猜我正在使用的inifinte滚动不是基于ajax的。（当然可是吗？）

由于

Answer 1

使用delegate：

$(".theImage").delegate('img', function() {
    $(this).load( function() { // only if images can be loaded dynamically
        handleImageLoad(this);
    });
    handleImageLoad(this);
});

Answer 2

问题是你的无限滚动插件不提供回调功能。加载图片后，无法对其产生影响。

我尝试修改您的插件，以便满足您的需求，请参阅http://jsfiddle.net/R8yLZ/

向下滚动JS部分直到看到一堆评论。

Answer 3

这看起来很复杂，我可能根本没有得到它，但无论如何我都会尝试： - ）

$("img", ".theImage").bind("load", function() {
    var winH = $(window).height();
    var imgH = $(this).height();
      if (winH < imgH) {
          $(this).height(winH);
          $(this).next().text("Browser " + winH + " image height " + imgH);
      }
});

jQuery - 一个.live（）＆gt; each（）＆gt; .load。（）finella

3 个答案: