jquery - JavaScript error: Uncaught TypeError: Cannot read property 'left' of undefined - Stack Overflow

admin管理员组

文章数量:1290192

This is a really annoying error and there seems to be various questions about this console error. It doesn't give me a whole lot to work with in the console using chrome.

 /**
     * Dropdown menu positioning
     */
    loc.dropMenuPositioning = function (){
        var dropMenu = $('.js-dropdown-item-wrap');
        var mainNavigationOffset = $('.js-nav-container > ul').offset();
        var mainNavigationPosition = mainNavigationOffset.left;
        dropMenu.css({'left' : mainNavigationPosition - 60});
    };

Sorry, i don't have much more to go with on this question. Any help would be greatly appreciated. Thank you.

This is a really annoying error and there seems to be various questions about this console error. It doesn't give me a whole lot to work with in the console using chrome.

 /**
     * Dropdown menu positioning
     */
    loc.dropMenuPositioning = function (){
        var dropMenu = $('.js-dropdown-item-wrap');
        var mainNavigationOffset = $('.js-nav-container > ul').offset();
        var mainNavigationPosition = mainNavigationOffset.left;
        dropMenu.css({'left' : mainNavigationPosition - 60});
    };

Sorry, i don't have much more to go with on this question. Any help would be greatly appreciated. Thank you.

• javascript
• jquery
• css
• console.log

Share Improve this question Follow edited Feb 9, 2016 at 21:42 Singleton asked Feb 9, 2016 at 18:03 SingletonSingleton 12322 gold badges77 silver badges1919 bronze badges 4

• 2 $nothing.offset() is null which would throw an error when trying to access a property of it. Perhaps the issue is that the $('.js-nav-container > ul') isn't finding anything. – Nebula Commented Feb 9, 2016 at 18:06
• Tip: try using the Chrome debugger and setting a breakpoint on the first line of your function. Then inspect the value of each variable. – sdgluck Commented Feb 9, 2016 at 18:07
• What is the value of mainNavigationOffset after you initialize it? – trenthaynes Commented Feb 9, 2016 at 18:08
• @sdgluck, not sure how to set a breaking point. – Singleton Commented Feb 9, 2016 at 18:28

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

You are reading the property left from an object returned in the previous row. The line that fails is:

var mainNavigationPosition = mainNavigationOffset.left;

The error means that mainNavigationOffset is undefined.

Because mainNavigationOffset is set as:

var mainNavigationOffset = $('.js-nav-container > ul').offset();

it is possible that jquery was not able to get the offset of the element $('.js-nav-container > ul').

As stated by the jquery documentation:

Note: jQuery does not support getting the offset coordinates of hidden elements or accounting for borders, margins, or padding set on the body element.

While it is possible to get the coordinates of elements with visibility:hidden set, display:none is excluded from the rendering tree and thus has a position that is undefined.

Check that the element is actually visible.

Another option (that seems what really happened) is that the jquery expression:

$('.js-nav-container > ul')

is not returning any element.

To see if the element is visible, you can use the chrome dev tool:

display must not be equals to none

visibility must be equals to visible

Or you can simply execute in the console:

$('.js-nav-container > ul').css("display");
$('.js-nav-container > ul').css("visibility");

Try this, jQuery doc

dropMenu.offset({ left: mainNavigationPosition - 60 });

Otherwise, you might need to set the position to absolute or relative:

link

Check if your jQuery version is up to 1.2, the .offset() method may not work in older versions.

jQuery 1.2 change log

本文标签： jqueryJavaScript error Uncaught TypeError Cannot read property 39left39 of undefinedStack Overflow