Uncaught TypeError: Невозможно прочитать свойство 'top' of undefined - JQuery

Question

Прошу прощения, если этот вопрос уже задан. Я много пробовал. но не будет работать. Если у меня есть .div1, то он отлично работает. но я удалил .div1. Консоль через ошибку, как показано ниже. Как это можно решить.

Uncaught TypeError: Cannot read property 'top' of undefined

JS Fiddle

HTML

<div class="div">Console error</div> 
<!-- <div class="div1">Working</div>--> 
<div class="div2">2</div> 

JQuery

function resize() { 
var position= $('.div1').offset(); 
var top= position.top; 
    var newtop = top + 60 + "px"; 
    $('.div2').css({ 
     'top': newtop 
    }); 
} 

$(window).resize(function(){ 
    resize(); 
}); 

window.onload = resize(); 

CSS

.div1 
{ 
    position:fixed; 
    top: 40px; 
} 
.div2 
{ 
    position:fixed; 
} 

JS Fiddle

Answer 1

Вам нужно проверить, соответствует ли селектор.

function resize() { 
    var position= $('.div1').offset(); 
    if (position) { 
     var top= position.top; 
     var newtop = top + 60 + "px"; 
     $('.div2').css({ 
      'top': newtop 
     }); 
    } 
} 

Answer 2

Проблема в том, что вы пытаетесь получить offset() элемента, который не существует в DOM, поэтому null возвращается. Затем вы пытаетесь получить свойство из значения null, которое вызывает ошибку.

Вместо этого, при определении значения top, вам необходимо проверить, что position присвоен правильно. Попробуйте это:

var top = position ? position.top : 0; 

Обратите внимание, что это будет Абонентский к значению position.top если таковые имеются, в противном случае он будет установлен в 0.

Answer 3

Не вычеркнуть div with class="div1" ... Ваш JQuery ориентирован этот DIV.

<div class="div">Console error</div> 
<div class="div1">Working</div> 
<div class="div2">2</div>