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)

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

另外，对于那些不喜欢看外部页面的人来说，这是我的列表化程序脚本似乎打破了一切：

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

您的列定位器默认为三列（columns在其defaults对象中为3。）当您在“#projects”上调用它时，只有两篇文章。你的插件（第50行，jquery.columnize.js）在一个只有两列的对象上从x = 1循环到3。然后将一个null对象传递给jQuery的each（）函数，这就是导致错误的原因。

jQuery：抛出“A is undefined”错误，JSLint说“jQuery（...）调用错误”这里有什么问题？

1 个答案: