jquery在控制檯中工作，但不在鏈接的js文件中

我正在使用jQuery腳本根據其尺寸添加類（縱向或橫向）。然後我使用jQuery垂直居中圖像。當我將它放到控制檯中時，該腳本完美地工作，但當我將它鏈接到文檔頭時，該腳本完美無缺。以下是我的代碼：jquery在控制檯中工作，但不在鏈接的js文件中

jQuery(document).ready(
    function() { 
     jQuery(".imgResize").each(function() { 
      var $this = jQuery(this); 
      if ($this.width() > $this.height()) { 
       $this.addClass("landscape"); 
      } else if ($this.width() < $this.height()) { 
       $this.addClass("portrait"); 
      } else { 
     } 
     var $h = $this.height(); 
     $this.css('margin-top', + $h/-2 + "px"); 
    }); 
});

什麼會導致此問題？

來源

2013-10-14 Jordan

如果你正在寫'Console.log'並嘗試運行到'IE'那麼它將無法工作。 'IE'不支持'Console' – Amit

imgResize'元素中有圖像 –

@AmitAgrawal我正在使用Chrome的js控制檯 – Jordan

你需要等待圖像加載

jQuery(document).ready(function() { 
    jQuery(".imgResize").on('load', function() { 
     var $this = jQuery(this); 
     if ($this.width() > $this.height()) { 
      $this.addClass("landscape"); 
     } else if ($this.width() < $this.height()) { 
      $this.addClass("portrait"); 
     } else { 

     } 
     var $h = $this.height(); 
     $this.css('margin-top', +$h/-2 + "px"); 
    }); 
});

來源

2013-10-14 06:08:39

其實在你情況下，你的jQuery腳本是圖像的加載之前運行。所以，如果你想在加載圖像後運行你的腳本。

然後，你需要使用jQuery Load

解決方案

jQuery(document).ready(
    function() { 
     jQuery(".imgResize").on('load', function() { 
      var $this = jQuery(this); 
      if ($this.width() > $this.height()) { 
       $this.addClass("landscape"); 
      } else if ($this.width() < $this.height()) { 
       $this.addClass("portrait"); 
      } else { 
     } 
     var $h = $this.height(); 
     $this.css('margin-top', + $h/-2 + "px"); 
    }); 
});

來源

2013-10-14 06:19:48

jquery在控制檯中工作，但不在鏈接的js文件中

回答

相關問題