jQuery应用load()方法后js失效的问题分析与解决
2013-01-22 19:35
776 查看
load()方法算是最简单的ajax了,非常方便,不过也有一些难以理解的地方。
比如不久前我出现了这样一个问题:
我的代码高亮是用pretty,它的特点是不破坏源代码,用js动态使代码着色,在载入正文后使用prettyPrint()函数使代码高亮生效。
我在另一个页面使用jQuery中的load()方法载入此页面的正文,但是代码区的高亮消失了,也就是说js代码未运行。这是可以理解的,因为load()方法并未运行原网页,而是将其当做数据传输,js根本未启动。
但是我在后面又加上prettyPrint()也依然没效果,再查看源代码才发现一个重要的问题:load()方法并未改变源代码,根本看不到我们load过来的正文内容。
我又使用find().is()来查找代码区的<pre>标签也显示没有。一段不存在的内容,应用prettyPrint()当然没效果了。
那么,load过来的内容到底去哪儿了呢?它真的不存在于任何地方吗?
不是这样的。后来我想到了曾看过的一个load()方法的教程里,讲的callback,这个以前我以为是针对load状态进行的反应,比如如果load失败可以通过这个显示一个什么之类的。现在记起来了,当时那个教程里不是将load过来的内容淡入展现吗?
这应该就是问题的关键了,于是我将prettyPrint()放入callback中,果然代码高亮出现了。
于是我知道了,load()方法里的内容的生命周期只在这个load方法之内,过了就再也找不到了!要给其中的内容应用js,需要统统放到callback里!
具体代码如下:
本文出自 “pockry的博客” 博客,请务必保留此出处http://pockry.blog.51cto.com/6350601/1124210
比如不久前我出现了这样一个问题:
我的代码高亮是用pretty,它的特点是不破坏源代码,用js动态使代码着色,在载入正文后使用prettyPrint()函数使代码高亮生效。
我在另一个页面使用jQuery中的load()方法载入此页面的正文,但是代码区的高亮消失了,也就是说js代码未运行。这是可以理解的,因为load()方法并未运行原网页,而是将其当做数据传输,js根本未启动。
但是我在后面又加上prettyPrint()也依然没效果,再查看源代码才发现一个重要的问题:load()方法并未改变源代码,根本看不到我们load过来的正文内容。
我又使用find().is()来查找代码区的<pre>标签也显示没有。一段不存在的内容,应用prettyPrint()当然没效果了。
那么,load过来的内容到底去哪儿了呢?它真的不存在于任何地方吗?
不是这样的。后来我想到了曾看过的一个load()方法的教程里,讲的callback,这个以前我以为是针对load状态进行的反应,比如如果load失败可以通过这个显示一个什么之类的。现在记起来了,当时那个教程里不是将load过来的内容淡入展现吗?
这应该就是问题的关键了,于是我将prettyPrint()放入callback中,果然代码高亮出现了。
于是我知道了,load()方法里的内容的生命周期只在这个load方法之内,过了就再也找不到了!要给其中的内容应用js,需要统统放到callback里!
具体代码如下:
$XX.load(url,function(){prettyPrint();})
本文出自 “pockry的博客” 博客,请务必保留此出处http://pockry.blog.51cto.com/6350601/1124210
相关文章推荐
- 使用jQuery的load方法设计动态加载及解决被加载页面js失效问题
- 一个js导致的jquery失效问题的解决方法
- 一个js导致的jquery失效问题的解决方法
- 应用UpdatePanel后jQuery事件失效问题的解决方法
- 使用jquery的load方法设计动态加载,并解决被加载页面JavaScript失效问题
- Jquery方法load之后导致js失效解决方法
- 使用jquery的load方法设计动态加载,并解决被加载页面JavaScript失效问题
- Bootstrap框架使用iframe及jQuery中load方法导致js失效问题
- jquery动态改变onclick属性导致失效的问题解决方法
- 使用jquery的load方法设计动态加载,并解决浏览器前进、后退、刷新等问题
- jQuery.form.js插件不能解决连接超时(timeout)的原因分析及解决方法
- 在使用Jquery的load方法加载时,只加载第一次的问题解决方法
- jquery动态添加元素事件失效问题解决方法
- jquery ajax方法如load,get等 在CHROME下失效的问题(已经解决)
- C#中??和?分别是什么意思? 在ASP.NET开发中一些单词的标准缩写 C#SESSION丢失问题的解决办法 在C#中INTERFACE与ABSTRACT CLASS的区别 SQL命令语句小技巧 JQUERY判断CHECKBOX是否选中三种方法 JS中!=、==、!==、===的用法和区别 在对象比较中,对象相等和对象一致分别指的是什么?
- jquery在ie7下选择器的问题导致append失效的解决方法
- Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法
- 分享一次分析/解决支付应用性能问题的全过程,细节和采用的工具和方法 推荐
- jquery.form.js的ajax提交,CKEditor编辑器内容丢失问题的解决方法!
- Jquery修改页面标题title其它JS失效的解决方法