jQuery中的事件在ready()方法里面和外面的区别
代码如下，是从W3School中copy出来的代码A：<html><head><scripttype="text/javascript"src="/jquery/jque...
代码如下，是从W3School中copy出来的
代码A：
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>
<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button type="button">Click me</button>
</body>
</html>
代码B：
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$("button").click(function(){
$("p").hide();
});
</script>
</head>
<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button type="button">Click me</button>
</body>
</html>
两段代码的区别只是将“$("button").click”放在ready事件中和事件外而已，代码很短，可以保证页面全部加载完毕后再进行操作，但是为什么点击按钮时候只有代码A有效果，代码B没有效果呢？
还望各位指教下 展开
代码A：
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>
<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button type="button">Click me</button>
</body>
</html>
代码B：
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$("button").click(function(){
$("p").hide();
});
</script>
</head>
<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button type="button">Click me</button>
</body>
</html>
两段代码的区别只是将“$("button").click”放在ready事件中和事件外而已，代码很短，可以保证页面全部加载完毕后再进行操作，但是为什么点击按钮时候只有代码A有效果，代码B没有效果呢？
还望各位指教下 展开
3个回答
展开全部
有区别.
ready()方法意思是等整个页面的DOM树解析完毕执行.
而直接绑定方法是页面流从上往下解析到当前位置时执行. 这个时候不一定DOM加载完毕, 所以很可能出错.
而放在ready方法里面,就不会出错!
参考：http://zhidao.baidu.com/link?url=wKWZP4j_sXI2Hszy4xCblqt1Xvjemut_taSs8Qrp4vQziZvJt-owmeNGddmN2gHSAZ2bB4SWnf7FsRjffbj6n_
ready()方法意思是等整个页面的DOM树解析完毕执行.
而直接绑定方法是页面流从上往下解析到当前位置时执行. 这个时候不一定DOM加载完毕, 所以很可能出错.
而放在ready方法里面,就不会出错!
参考：http://zhidao.baidu.com/link?url=wKWZP4j_sXI2Hszy4xCblqt1Xvjemut_taSs8Qrp4vQziZvJt-owmeNGddmN2gHSAZ2bB4SWnf7FsRjffbj6n_
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
可以保证页面全部加载完毕后再进行操作 看看你说的这句话
其实A代码就是加载完后绑定的事件
但是B代码是页面没加载就绑定事件
这时候按钮都没有 就没法绑定事件 点击按钮当然没反应
或者把JS放到BODY后面去也可以
其实A代码就是加载完后绑定的事件
但是B代码是页面没加载就绑定事件
这时候按钮都没有 就没法绑定事件 点击按钮当然没反应
或者把JS放到BODY后面去也可以
追问
呵呵，不好意思，JQ初学者
如果这样的话，那么是不是说所有的JQ事件都要放在ready事件中？
或者说如果我不想用ready方法的话，那么所有JQ的触发性事件都要放在BODY后面？
还请指教下
追答
嗯 就是这2种
ready有简单的写法
$(function(){
放这里也可以
})
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
ready方法为dom节点解析完毕后开始执行的，直接写在外面就为顺序执行。
写在外面的函数 执行时button还没有解析生成,是绑不上去的哦
写在外面的函数 执行时button还没有解析生成,是绑不上去的哦
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
