解决pjax加载页面不执行js插件的问题

个人博客 地址:http://www.wenhaofan.com/article/20180913220425

介绍

在使用jquery.pjax的时候发现加载页面时不会执行其中的layui以及jquery的初始化方法，包括一些插件的初始化方法。

查看源码后发现该jquery.pjax替换容器内容时，是将服务器端返回的html转换为了jquery dom节点然后再执行的替换，但是这样操作会导致一系列的加载事件不会被触发，导致例如jquery和layui的初始化方法不会被执行。

于是决定将添加dom节点修改为直接添加html片段。

修改代码

1.将jquery.pjax.js中311行的 context.html(container.contents)修改为 context.html(data)。

    这样在pjax加载新页面的时候便会直接将服务器端返回html片段添加进容器。

    但是这样仅处理了新增页面，而执行回退操作时pjax会从缓存中读取上一个页面的内容，同样pjax在回退上一个页面的时候依然是以dom节点的方式存储和添加的，所以我们还需要继续修改。

2.

    将365行的

    cachePush(pjax.state.id, [options.container, cloneContents(context)])

    修改为

  cachePush(pjax.state.id, [options.container, context.html()])

到此修改完成，此时使用pjax加载新页面的时候，layui jquery等插件的初始化方法即可正确执行。