我有一个包含很多javascripts的页面。我有内容，它有JavaScript效果。我想使用ajax将内容更改为另一个内容（当然具有相同的javascript效果）。
这是我的ajax请求代码：
<head>
<script type="text/javascript">
function ajax(txt) {
if (window.XMLHttpRequest)
{
xmlhttp = new XMLHttpRequest();
}
else
{
xmlhttp = new ActiveXObject("MICROSOFT.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 & xmlhttp.status==200)
{
document.getElementById("content").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET", "index.php?p="+txt, true);
xmlhttp.send();
}
</script>
</head>
<body>
<div id="content">
...content...
</div>
<input type="button" onclick=ajax('2') value="click" />
</body>
问题是内容已更改，但新内容没有任何javascript效果。我认为javascripts需要重新加载但是如何在ajax请求之后执行它？
谢谢
您不必重新加载您的JavaScript文件。您所要做的就是让“效果”知道您的页面上有新内容。通常你必须再次运行一个函数。如果使用jquery函数是$（document.ready（...））。如果你的“效果”没有包装在函数中而不是包装它们，并在内容被更改时调用此函数。
如果重新加载Javascript文件是解决方案，您可以尝试此功能：
function inject(src, cb, target){
target = target || document.body;
var s = document.createElement('SCRIPT');
s.charset = 'UTF-8';
if(typeof cb === 'function'){
s.onload = function(){
cb(s);
};
s.onreadystatechange = function () {
(/loaded|complete/).test(s.readyState) && cb(s);
};
}
s.src = src;
target.appendChild(s);
return s;
};
并使用它：
inject('path/to/new.js');
如果要在加载文件时触发操作，请使用回调函数：
inject('path/to/new.js', function(s){
//the file is loaded
});
在新的content块中包含JavaScript以及在使用以下内容插入新节点后重新运行效果脚本：
/**
* Evaluates scripts included via innerHTML.
* @param {Node} node Node containing scripts.
* */
function evalScripts(node){
if (!node) return;
var st = node.getElementsByTagName('SCRIPT');
var strExec;
for (var i = 0; i < st.length; i++) {
strExec = st[i].text;
//st[i].parentNode.removeChild(st[i]);
st[i].text = '';
try {
var x = document.createElement('script');
x.type = 'text/javascript';
x.innerHTML = strExec;
document.getElementsByTagName('head')[0].appendChild(x);
}
catch (bug) {}
}
};
如果你计划了很多这样的操作，那么以某种方式从head删除旧脚本也是个好主意。