Не могу заставить JQuery работать

Question

Итак, у меня есть эта скрипка http://jsfiddle.net/3QuSm/1/ для выпадающего списка.

$(".image-box").mouseover(function() { 
    $(".expand-box").show(); 
}).mouseout(function() { 
    $(".expand-box").hide(); 
}); 

Это работает просто отлично, но когда я пытаюсь интегрировать его в моей заявке JQuery не работает. Я вроде как новый с JQuery, и я не знаю, где его разместить. Мой код - это что-то вроде http://pastie.org/8042113. Любая помощь?

Answer 1

Вам необходимо использовать $(document).ready() (или $(window).load()).

Нельзя безопасно манипулировать страницей, пока документ не будет готов. jQuery определяет это состояние готовности для вас. Код, включенный внутри $ (document) .ready() будет запускаться только после того, как страница Document Object Model (DOM) готова для выполнения кода JavaScript. Код, включенный внутри $ (window) .load (function() {...}), будет запускаться после того, как будет готова вся страница (изображения или фреймы), а не только DOM.

$(document).ready(function() { 
    ... /* Your code here */ 
}); 

http://jsfiddle.net/3QuSm/5/

Answer 2

Вы должны поместить свой код в случае ready или load, так что она проходит после того, как элементы страницы были созданы:

<script> 

$(document).ready(function(){ 

    $(".image-box").mouseover(function() { 
    $(".expand-box").show(); 
    alert("something"); 
    }).mouseout(function() { 
    $(".expand-box").hide(); 
    alert("something"); 
    }); 

}); 

</script> 

Когда ты поместите код в jsfiddle, он по умолчанию помещает его в событие load, поэтому он работает там, а не на вашей странице.

Answer 3

Вам нужно подождать, пока DOM будет готов к манипуляции.
поместить ваш код в document.ready()

вот скрипку: http://jsfiddle.net/3QuSm/8/

Answer 4

Может быть, JQuery не загружается, перейдите на эту страницу в своем локальном хосте, и посмотреть исходный код, открыть ссылку, которая указывает на JQuery, если вы можете увидеть код, он загружен.

Попробуйте это, чтобы узнать, загружен ли JQuery.

<script type="text/javascript"> 
<!-- 
$(document).ready(function() { 
    alert ("JQuery working!"); 
}); 
//--> 
</script> 

Надеюсь, это поможет.