jQuery：「A未定義」錯誤被拋出，JSLint說「jQuery（...）錯誤地調用」這裏有什麼問題？

Question

我通常不會發布這種東西，但我完全沒有想法，經過幾個小時的努力修復這個事情，我根本不知道在哪裏尋找錯誤，甚至這個錯誤意味着什麼。

，打破該網頁，請訪問：http://staging.mathewhawley.com/

我建立一個小的columnizer jQuery插件，這似乎導致此錯誤，但對我來說，它看起來像我寫的插件一切都是完全合法的。

打開Firebug的console和JSLint以下被記錄：

jQuery(...) called incorrectly 
jquery.lint.js (line 96) 
More info: 
jquery.lint.js (line 111) 
jQuery(...) called incorrectly 
jquery.lint.js (line 96) 
More info: 
jquery.lint.js (line 111) 
a is undefined 
[Break On This Error] (function(a,b){function cg(a){return d...a:a+"px")}}),a.jQuery=a.$=d})(window); 
jquery.min.js (line 16) 

點擊「詳細信息」鏈接，我得到以下上：

Location: 
jquery.lint.js (line 111) 

You passed: ["#projects", undefined, jQuery(Document index.php)] 

Available signatures include: 
jQuery(selector, [context]) 
jQuery(element) 
jQuery(elementArray) 
jQuery(jQuery object) 
jQuery() 
jQuery(html, [ownerDocument]) 
jQuery(html, props) 
jQuery(callback) 

我使用的是最新的jQuery版本通過Google CDN（<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>）。

也只是對於那些不喜歡看一個外部頁面，這裏是我的columnizer腳本，似乎打破東西：

script.js // this file invokes all javascript. 
jQuery(document).ready(function($) { 

    // helper 
    function scrollable() { 
     if ($.browser.webkit) { 
      return $('body'); 
     } else { 
      return $('html'); 
     } 
    } 

    // ========================= 
    // = Stuff on the homepage = 
    // ========================= 
    if ($('#projects').length) { 

     $('#projects').children().hide(); 

     // Create column layout 
     $(window).load(function() { 

      $('#projects').columnize(); 

      function _reveal(el) { 
       if (el !== undefined) { 
        el.fadeIn(100 , function() { _reveal($(this).next()); }); 
       } 
      } 
      _reveal($('#projects').children().first()); 
     }); 

    } 

    // ============================= 
    // = Stuff on the project page = 
    // ============================= 
    // Add sticky project info 
    if ($('#project').length) { 

     $('article','#project').sticky(); 
     // Back to Top link 
     $('nav a[href=#tothetop]').click(function(e) { 
      e.preventDefault(); 
      scrollable().animate({'scrollTop':0}, 400); 
     }); 

    } 

}); 

。

jquery.columnizer.js // the columnizer helper script 
(function($){ 
    $.fn.extend({ 
     columnize: function(options) { 

      var defaults = { 
       columns : 3, 
       gutter : 20 
      }, 
       options = $.extend(defaults, options), 
       o = options, 
       internal = {}, 
       _i = internal; 

      _i.container  = $(this); // container 
      _i.containerHeight = 0; // container 
      _i.items   = _i.container.children(); // elements inside container 
      _i.w    = _i.items.first().width(); 
      _i.columns   = {}; 
      _i.colHeight  = {}; 

      // Setup the container and its children's position 
      _i.container.css({ 
       'position': 'relative' 
      }).children().css({ 
       'position': 'absolute' 
      }); 

      // cycle through all items and place them into arrays by column 
      _i.items.each(function(i) { 

       var itemPlace = i%o.columns; // get the column 
       var col = itemPlace + 1; // start index at 1 

       if (_i.columns[col] === undefined) { 
        _i.columns[col] = [$(this)]; // if the column doesn't already exist create it 
       } else { 
        _i.columns[col].push($(this)); // otherwise add the current element to the correct column 
       } 

       var left = itemPlace * (_i.w + o.gutter); // calculate the left offset for the columns 

       $(this).css({ 
        'left': left + 'px', // apply the offset 
        'margin-left': 0  // and make sure no margin-left is on the container 
       }); 

      }); 

      // Cycle through the existing columns 
      for (var x=1; x <= o.columns; x++) { 

       if (_i.colHeight[x] === undefined) { // create variables for storing the top offset to be applied to elements of this column 
        _i.colHeight[x] = 0; // start at creating it and setting it to 0 
       } 

       $.each(_i.columns[x], function(z, el) { // within each column cycle through its items 

        $el = $(el); 
        $el.css('top', _i.colHeight[x]+'px'); // set the top offset 
        _i.colHeight[x] += $el.outerHeight(true); // then add this elements height to the same variable 

       }); 

      }; 
      // go through the columns 
      $.each(_i.colHeight, function(key, val) { 
       if (_i.containerHeight < val) { 
        _i.containerHeight = val; // if this column's height is greater than the currently stored height, replace the height with this one 
       } 
      }); 
      _i.container.css({ 
       'height': _i.containerHeight+'px', // set the outer container to the tallest column's height 
       'overflow':'hidden' 
      }); 
      // done. 
     } 
    }); 
})(jQuery); 

任何幫助將非常感激。

感謝遠讀這篇文章，

Jannis

Answer 1

你columnizer默認爲三列（columns是3在其defaults對象。）當你調用它的「#projects」，只有兩篇文章。你的插件（在第50行，jquery.columnize.js）從一個只有兩列的對象上從x = 1到3循環。然後將空對象傳遞給jQuery的each（）函數，這是導致錯誤的原因。