所以我有一个下拉列表的小提琴http://jsfiddle.net/3QuSm/1/。
$(".image-box").mouseover(function() {
$(".expand-box").show();
}).mouseout(function() {
$(".expand-box").hide();
});
这很好用,但是当我尝试将它集成到我的应用程序中时,JQuery不起作用。我对JQuery有点新意,我真的不知道把它放在哪里。我的代码类似于http://pastie.org/8042113。有什么帮助吗?
答案 0 :(得分:3)
您需要使用$(document).ready()
(或$(window).load()
)。
在文档“准备就绪”之前,无法安全地操作页面。 jQuery为您检测这种准备状态。包含在$(document).ready()中的代码只有在页面文档对象模型(DOM)准备好执行JavaScript代码后才会运行。包含在$(window).load(function(){...})中的代码将在整个页面(图像或iframe)(而不仅仅是DOM)准备就绪后运行。
$(document).ready(function() {
... /* Your code here */
});
答案 1 :(得分: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
事件中,这就是为什么它在那里工作而不在您的页面中。
答案 2 :(得分:0)
你需要等到DOM准备好进行操作
将您的代码放在document.ready()
这里是小提琴:http://jsfiddle.net/3QuSm/8/
答案 3 :(得分:0)
可能没有加载JQuery,导航到localhost中的那个页面,看到源代码,打开指向JQuery的链接,如果你能看到代码,它就被加载了。
尝试此操作以查看是否已加载JQuery。
<script type="text/javascript">
<!--
$(document).ready(function() {
alert ("JQuery working!");
});
//-->
</script>
希望这有帮助。