Ajax重载页面js脚本代码失效的解决办法

如今Ajax的流行同时也带来了许多小困惑，因为是页面的异步分离加载，导致html和js不是同时进行的，有些是函数取不到元素，有些是绑定不了事件，还有就是内嵌脚本压根不执行。这些问题对于初学者来说更是摸不着头脑。这里整理了两个针对不同原因围绕重载页面代码js脚本失效的解决方法。

1. 一个是头部外链已经引入的js文件里面的代码功能在重载页面后失效的解决办法：解决的办法就是在ajax的回调函数重新通过脚本创建加载一遍该js文件地址，以下是代码，简单明了：

var aa=document.getElementsByTagName('HEAD').item(0);
var nn=document.createElement("script");
nn.src="http://www.baidu.com/xxx.js";
aa.appendChild(nn);

只要修改此处src地址为js文件地址就可以用了

2. 第二种是内联的javascript脚本不执行导致的异常。这种脚本通常是把代码直接插在html中，如：

<div id="qiuye"></div>
<script>alert("这是直接混在html中的js代码")</script>
</script>

然后我们通过ajax得到这段html代码并把它插在网页的另一个地方就会出现<script>代码完全不起作用了。解决办法就是在ajax请求操作完成后。分析请求回来的html，用正则匹配找出<script>代码块，通过eval手动把这些代码块运行一遍。函数代码如下：

function evalScript(html)
{
var reg = /<script[^>]*>([^\x00]+)$/i;
var htmlBlock = html.split("<\/script>");
for (var i in htmlBlock)
{
var blocks;
if (blocks = htmlBlock[i].match(reg))
{
var code = blocks[1].replace(/<!--/, '');
try {eval(code)}
catch (e) {console.log(e);}
}}}

调用方法就是：evalScript($('#' + ajaxcontent).html()); 红色部分为ajax请求回来html，自行更改。