JQuery 引发两次$(document.ready)事件


Posted in Javascript onJanuary 15, 2010

页面大概是这样的,一个Partial View,而这个View包含了一小段绑定Search的Javascript,并且用Jquery-ui 的dialog 包含,而且确定不是ASP.net mvc生成HTML的问题,HTML是依照我的想法生成的,后来实在没有办法,把dialog的代码去掉,Search按就正常了。查了一下dialog的代码,发现 是appendTo引发的。
做了实验,代码如下:
代码

<script type="text/javascript"> 
$(document).ready(function() { 
$("#a1").appendTo($("#a2")); 
}); 
</script> <div id="a1"> 
<script type="text/javascript"> 
alert('a1'); 
</script> 
</div> 
<div id="a2"> 
</div>

预计 alert('a1') 应该执行一次的,但是由于使用了appendTo,执行了两次,无论你在 a1 div里面是否使用$(document).ready,都会运行两次javascript,第一次document 加载完成,第二次是调用 appendTo.

首先改为下面这种方式,失败。
代码

<div id="a1"> 
<script type="text/javascript"> 
loaded = false; 
if (loaded == false) { 
alert('a1'); 
loaded = true; 
} 
</script> 
</div>

再改成下面这种,就可以成功了。
var loaded = false; 
$(document).ready(function() { 
if (!loaded) { 
alert('a1'); 
loaded = true; 
} 
});
Javascript 相关文章推荐
Ctrl+Enter提交内容信息
Jun 26 Javascript
JS网络游戏-(模拟城市webgame)提供的一些例子下载
Oct 14 Javascript
javascript 正则替换 replace(regExp, function)用法
May 22 Javascript
使用JavaScript检测Firefox浏览器是否启用了Firebug的代码
Dec 28 Javascript
Jquery 表格合并的问题分享
Sep 17 Javascript
jQuery控制frames及frame页面JS的方法
Mar 08 Javascript
AngularJS教程 ng-style 指令简单示例
Aug 03 Javascript
js实现淡入淡出轮播切换功能
Jan 13 Javascript
Vue.js弹出模态框组件开发的示例代码
Jul 26 Javascript
vue2 router 动态传参,多个参数的实例
Nov 10 Javascript
Vue.js实现图片的随意拖动方法
Mar 08 Javascript
Angular ui-roter 和AngularJS 通过 ocLazyLoad 实现动态(懒)加载模块和依赖
Nov 25 Javascript
用jQuery扩展自写的 UI导航
Jan 13 #Javascript
jQuery的一些特性和用法整理小结
Jan 13 #Javascript
JavaScript关于select的相关操作说明
Jan 13 #Javascript
海量经典的jQuery插件集合
Jan 12 #Javascript
JQuery获取元素文档大小、偏移和位置和滚动条位置的方法集合
Jan 12 #Javascript
jquery下操作HTML控件的实现代码
Jan 12 #Javascript
jquery插件 cluetip 关键词注释
Jan 12 #Javascript
You might like
PHP版网站缓存加快打开速度的方法分享
2012/06/03 PHP
PHP防止跨域提交表单
2013/11/01 PHP
PHP数据库连接mysql与mysqli对比分析
2016/01/04 PHP
php将服务端的文件读出来显示在web页面实例
2016/10/31 PHP
Javascript下的keyCode键码值表
2007/04/10 Javascript
关于flash遮盖div浮动层的解决方法
2010/07/17 Javascript
jQuery前台数据获取实现代码
2011/03/16 Javascript
Javascript 赋值机制详解
2014/11/23 Javascript
javascript编写贪吃蛇游戏
2015/07/07 Javascript
js实现简洁的TAB滑动门效果代码
2015/09/06 Javascript
javascript判断复选框是否选中的方法
2015/10/16 Javascript
js实现兼容IE、Firefox的图片缩放代码
2015/12/08 Javascript
javascript中apply、call和bind的使用区别
2016/04/05 Javascript
JavaScript:Array类型全面解析
2016/05/19 Javascript
JS+html5 canvas实现的简单绘制折线图效果示例
2017/03/13 Javascript
浅谈通过JS拦截 pushState和replaceState事件
2017/07/21 Javascript
vue2.0 element-ui中el-select选择器无法显示选中的内容(解决方法)
2018/08/24 Javascript
vue限制输入框只能输入8位整数和2位小数的代码
2019/11/06 Javascript
node.js中npm包管理工具用法分析
2020/02/14 Javascript
解决vue动态路由异步加载import组件,加载不到module的问题
2020/07/26 Javascript
在vue-cli创建的项目中使用sass操作
2020/08/10 Javascript
如何利用nodejs自动定时发送邮件提醒(超实用)
2020/12/01 NodeJs
Python itertools模块详解
2015/05/09 Python
python中的随机函数random的用法示例
2018/01/27 Python
Python爬虫抓取代理IP并检验可用性的实例
2018/05/07 Python
python3中os.path模块下常用的用法总结【推荐】
2018/09/16 Python
对python opencv 添加文字 cv2.putText 的各参数介绍
2018/12/05 Python
DataFrame:通过SparkSql将scala类转为DataFrame的方法
2019/01/29 Python
详解Python装饰器
2019/03/25 Python
Pytorch生成随机数Tensor的方法汇总
2020/09/09 Python
Python基于locals返回作用域字典
2020/10/17 Python
Python+Appium实现自动化清理微信僵尸好友的方法
2021/02/04 Python
美国LOGO设计公司:The Logo Company
2018/07/16 全球购物
安全生产目标责任书
2014/04/14 职场文书
电子专业毕业生自荐信
2014/05/25 职场文书
新年晚会开场白
2015/05/29 职场文书