温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

jQuery应用load()方法后js失效的问题分析与解决

发布时间:2020-06-17 19:24:17 来源:网络 阅读:5943 作者:pockry 栏目:web开发

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里!

具体代码如下:

 

  1. $XX.load(url,function(){prettyPrint();}) 

 

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI