jQuery - 不起作用的变量比较

时间:2011-10-09 14:00:58

标签: jquery if-statement conditional tumblr

编辑:我把它放在文件就绪功能中。 虽然图像很大,文档是否符合大图像? 你可以看到它在这里不起作用:http://syndex.me

这让我悄悄疯了。

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

$(".theImage").children('img').each(function() {
  myHeight = $(this).height();
      if ( myHeight > maxxxHeight ){
      $(this).next().text("Browser " + maxxxHeight + " image height " + myHeight);
  };
});

出于某种原因,

  

myHeight> maxxxHeight不会出现任何问题。有些图像的尺寸更大,有些则没有。图像不是由CSS设置的。事实上,它们的宽度和高度都没有明确规定。

这怎么可能?这是一个总的noob问题,但如果是和< />一百万次之前。

由于

2 个答案:

答案 0 :(得分:2)

我可以想到这可能发生的几个原因。

  1. 代码运行时图像可能尚未完全加载。
  2. 您的图片可能不是与您的班级匹配的元素的直接子项。
  3. 您的代码可能在文档加载之前运行,但尚未与该类匹配。
  4. 我最好的猜测是(1),在这种情况下,您应该为图像添加一个加载处理程序,以便在图像完成加载时执行所需的操作。在文档加载和图像加载上运行代码可能是为了在缓存图像并且在应用图像加载处理程序之前触发它的load事件的情况下。如果在加载文档后动态替换图像,则需要进行图像加载。

    注意:您应该在本地确定myHeight的范围,以避免污染全局命名空间(以及由于范围问题导致的潜在错误)。

    $(document).load( function() {
        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 ){
               // this is where your real code would go to make adjustments, etc.
               $img.next().text("Browser " + maxxxHeight + " image height " + myHeight);
            };
        }
    });
    

答案 1 :(得分:0)

你需要做一些调试。由于比较失败,请通过将myHeight和maxxxHeight的值打印到控制台来检查它们。我保证这两个中的一个不是数字。事实上,一个可能是未定义的。

您是否将jQuery代码置于$(document).ready()调用中?