30

I'm trying to obtain the top from an element but I'm getting this error, what does it mean and how do I get rid of it?

$(".hover").offset().top

>Uncaught TypeError: Cannot read property 'top' of undefined

$(".hover")

[div.hover, prevObject: x.fn.x.init[1], context: document, selector: ".hover", jquery: "2.0.3", constructor: function…]
[prevObject: x.fn.x.init[1], context: document, selector: ".hover", jquery: "2.0.3", constructor: function…]

This happens inside the drop event of jqueryui when I try to drop it into a nested droppable.

$.fn.makeDroppable = function(){
    $(this).droppable({
        drop: function(event, ui) {
            console.log($(".hover"));
            console.log($(".hover").offset().top);
            $(".hover").makeDroppable().removeClass("hover");
        },
        over: function(event, ui) {
            $("<div>").addClass("hover").appendTo(this);
        }
    });
}
$(".container").makeDroppable();

<div class="container"></div>
ASGM
  • 11,051
  • 1
  • 32
  • 53
shuji
  • 7,369
  • 7
  • 34
  • 49
  • 5
    it is because there is no element with class `myelement` in your page – Arun P Johny Oct 31 '13 at 02:36
  • @ArunPJohny There is, $(".hover") returns the element and prevObject which is not allowing me to use the top value. – shuji Oct 31 '13 at 02:54
  • 2
    You don't need to worry about `prevObject`. It's used for internal purposes. Your DOM selection is finding `0` elements. – Blue Skies Oct 31 '13 at 03:00
  • Yeah, I can see that now, apparently the problem is caused by the nested droppables event being called. Thank you. – shuji Oct 31 '13 at 03:05

2 Answers2

24

jQuery returns prevObject if the DOM does not have the element for which jQuery is being run. You might see the element in your source at the run-time however, it is not not bound to the DOM and therefore, it shows prevObject. Try checking your js file again or else paste the code here.

Ami
  • 241
  • 2
  • 4
14

Although the error is not related to prevObject, I will explain it since it's a question in the title.

jQuery .end()

End the most recent filtering operation in the current chain and return the set of matched elements to its previous state.

To return its previous state, jQuery returns prevObject which contains selected elements before filtering operation, such as .find(), .filter() and .children(), is applied.

Example

$('#target').append($('div').find('input').remove().end());

$('div') will select all div elements. --- (*1)

Then, $('div').find('input').remove() will select all input elements inside the selected div elements and delete these input elements.

After that, $('div').find('input').remove().end() will return the elements before .find('input') is called. Therefore, it will return all div elements same as in (*1) except that all input elements inside divs are removed. The returned elements are stored in prevObject.

Finally, the returned elements (*1) are appended to #target.

.end()'s documentation: https://api.jquery.com/end/

Northnroro
  • 525
  • 1
  • 6
  • 10