关于$(document).ready的一个问题。

刘老高 2009-03-25 10:16:56

今天跟着视频做一个LIST树型目录的小程序。用的是AJAX的JQUERY库。看上去和视频都是一样的。但就是不能正常显示
问题主要出现在JS中使用JQUERY的$(document).ready方法来对页面中的元素进行批量的装载方法
麻烦大家帮小弟看一下。不胜感激！用的是jquery的库
－－－－－－－－－－－－－－－－－html文件－－－－－－－－－－－－－－－－－
<html>
<head>
<title>JQUERY实例2：弹出菜单</title>
<link rel="stylesheet" type="text/css" href="css/menu.css">
<script type="text/javascript" src="jslib/jquerymenu.js"></script>
<script type="text/javascript" src="jslib/jquery.js"></script>
</head>
<body>

<ul>list1
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<ul>list2
<li>a</li>
<li>b</li>
<li>c</li>
</ul>
</body>
</html>
－－－－－－－－－－－－－－－－－－js文件－－－－－－－－－－－－－－－－－－－－－
//注册页面装载时执行的方法
$(document).ready(function (){
//这里需要首先找到所有的主菜单
//然后给所有的主菜单注册点击事件
var uls=$("ul");
uls.click(function (){
//这里需要找到当前的ul中的li，然后后li显示出来
//获取当前被点击的ul节点
var ulNode=$(this);
//找到当前ul节点的所有li子节点
var lis=ulNode.children("li");
//让子节点显示或隐藏
lis.toggle("show");
});
});
－－－－－－－－－－－－－－－－－－－－－－CSS文件－－－－－－－－－－－－－－－－－－－－－－－
/*如何让所有的li都不显示小圆点，可以使用标签选择器*/
li{
/*使li前面的小圆点消失*/
list-style:none;
/*让子菜单向右移动5个像素*/
margin-left:5px;
/*先隐藏所有的li子菜单*/
display:none;
}

...全文

417 2 打赏收藏转发到动态举报

写回复

用AI写文章

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

高利 2009-08-13

打赏
举报

我也遇到了一个类似的关于$(document).ready() 的问题，原因是：
$(document).ready() --- This is the first thing to learn about jQuery: If you want an event to work on your page, you should call it inside the $(document).ready
() function. Everything inside it will load as soon as the DOM is
loaded and before the page contents are loaded."
这个方法里面的js 代码要优先执行，即先执行该代码，才加载 html dom 数据。如果 js 里面用到 dom 的数据，如果没有该dom 就会报错。。。。

刘老高 2009-03-25