我有一个网页，其中做一个AJAX调用并加载整个页面。这被加载该页面有一些JavaScript。 JavaScript的本身加载时工作正常，但是当它被通过AJAX加载后，JavaScript不工作。我不知道我错过了什么。

加载的页面的code

 ＆LT; HTML＆GT;
＆LT;脚本类型=文/ JavaScript的＆GT;
功能showfield（名字）{
如果（名称=='lstbox）的document.getElementById（'DIV1'）的style.display =块。
。其他的document.getElementById（'DIV1'）的style.display =none的;
}

功能hidefield（）{
。的document.getElementById（'DIV1'）的style.display =无;
}

＆LT; / SCRIPT＆GT;

＆LT; HEAD＆GT;
＆LT; /头＆GT;
＆LT;身体的onload =hidefield（）＆GT;
＆LT;形式的行动=test2.php方法=邮报＆GT;

请输入一个名称为App＆LT;输入类型=文本名称=名称＆GT;

＆LT;表格边框=1＆GT;＆LT; TR＆GT;＆LT;第i个选择标签＆LT; /第i个百分位＆GT;选择一个元素＆lt; /第i;＆LT; / TR＆GT;

＆LT; TR＆GT;＆LT; TD＆GT;＆LT;输入类型=文本名称=label1的/＆GT;＆LT; / TD＆GT; ＆LT; TD＆GT;

＆LT;选择名称=elementtype1ID =elementtype1的onchange =showfield（this.options [this.selectedIndex] .value的）＆GT;

＆LT;期权价值='选择'＆GT;选择＆LT; /选项＆GT;

＆LT;期权价值='txtbox'＆gt;文字框＆LT; /选项＆GT;

＆LT;期权价值='lstbox'＆GT;列表框＆LT; /选项＆GT;

＆LT;期权价值='chkbox'＆GT;复选框＆LT; /选项＆GT;

＆LT;期权价值='广播'＆GT;单选按钮＆LT; /选项＆GT;

＆LT; /选择＆GT;＆LT; / TD＆GT;＆LT; TD＆GT;＆LT; D​​IV ID =div1的＆GT;进入列表框选择：其中;输入类型=文本名称=whatever1/＆GT;＆LT; / DIV＆GT;＆LT ; / TD＆GT;＆LT; / TR＆GT;

＆LT; /表＆gt;

＆LT;输入类型=提交值=提交＆GT;

＆LT; /形式GT;

＆LT; /身体GT;

＆LT; / HTML＆GT;
 

加载的code（AJAX）页

 ＆LT; HTML＆GT;
＆LT; HEAD＆GT;
＆LT; /头＆GT;
＆LT;身体GT;

＆LT;脚本SRC =ajax.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本SRC =responseHTML.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;

＆LT; D​​IV ID =储存的风格=显示：无;＆GT;
＆LT; / DIV＆GT;

＆所述;股利的id =显示＆GT;



＆LT;表格名称=Ajax的方法=POST行动=＆GT;
    ＆其中p为H.;

    ＆LT;输入类型=按钮值=获取面板ONCLICK =loadWholePage（'appcreator.php'）＆GT;

    ＆所述; / P＆GT;

＆LT; / FORM＆GT;
＆LT; / DIV＆GT;



＆LT; /身体GT;
＆LT; / HTML＆GT;
 

的ajax.js code

 函数createXHR（）
{
    VAR请求= FALSE;
        尝试 {
            要求=新的ActiveXObject（MSXML2.XMLHTTP）;
        }
        赶上（ERR2）{
            尝试 {
                要求=新的ActiveXObject（Microsoft.XMLHTTP）;
            }
            赶上（ERR3）{
        尝试 {
            要求=新XMLHtt prequest（）;
        }
        赶上（ERR1）
        {
            请求= FALSE;
        }
            }
        }
    返回请求;
}
 

的responseHTML.js code

 函数getBody（内容）
{
   测试= content.toLowerCase（）; //消除区分大小写
   VAR X = test.indexOf（＆LT;身体）;
   如果（X == -1）返回;

   X = test.indexOf（＆gt;中，x）的;
   如果（X == -1）返回;

   变种Y = test.lastIndexOf（＆LT; /身体GT;）;
   如果（Y == -1）Y = test.lastIndexOf（＆LT; / HTML＆gt;中）;
   如果（Y == -1）Y = content.length; //如果没有HTML然后就抓住一切直到结束

   返回content.slice（X + 1，Y）;
}

/ **
    加载HTML页面
    把身体标记的内容到当前页面。
    参数：
        网址的其他HTML页面的加载
        ID标签的有容纳内容
* /

功能loadHTML（URL，有趣，存储，参数）
{
    VAR XHR = createXHR（）;
    xhr.onreadystatechange =功能（）
    {
        如果（xhr.readyState == 4）
        {
            //if(xhr.status == 200）
            {
                storage.innerHTML = getBody（xhr.responseText）;
                有趣（存储，参数）;
            }
        }
    };

    xhr.open（GET，URL，真正的）;
    xhr.send（空）;

}

    / **
        回电话
        直接分配标签
    * /


    功能processHTML（温度，目标）
    {
        target.innerHTML = temp.innerHTML;
    }

    功能loadWholePage（URL）
    {
        变种Y =的document.getElementById（存储）;
        变种X =的document.getElementById（显示）;
        loadHTML（网址，processHTML，X，Y）;
    }


    / **
        创建responseHTML
        为ACCES通过DOM的方法
    * /

    功能processByDOM（responseHTML，目标）
    {
        target.innerHTML =提取编号：LT; BR /＆gt;中;

        //不与镀铬/ Safari浏览器工作
        // VAR消息= responseHTML.getElementsByTagName（分区）namedItem（二）的innerHTML。;
        。VAR消息= responseHTML.getElementsByTagName（分区）项（1）.innerHTML;

        target.innerHTML + =消息;

        target.innerHTML + =＆LT; BR /＆GT;的名字提取：LT; BR /＆gt;中;

        。消息= responseHTML.getElementsByTagName（形式）项目（0）;
        target.innerHTML + = message.dyn.value;
    }

    功能accessByDOM（URL）
    {
        // VAR responseHTML = document.createElement方法（机构）; //坏戏
        VAR responseHTML =的document.getElementById（存储）;
        变种Y =的document.getElementById（显示）;
        loadHTML（URL，processByDOM，responseHTML，Y）;
    }
 

解决方案

这个脚本是身体标记之外，与装载机挑选出只有body标签里面的code，所以剧本是不是连部分是什么你添加到页面。

I have a page which does an AJAX call and loads an entire page. The page that gets loaded has some Javascript. The javascript works on page by itself when loaded, but when its gets loaded by AJAX, the Javascript does not work. I dont know what I am missing.

The code of the loaded page

<html>
<script type="text/javascript">
function showfield(name){
if(name=='lstbox')document.getElementById('div1').style.display="block";
else document.getElementById('div1').style.display="none";
}

function hidefield() {
document.getElementById('div1').style.display='none';
}

</script>

<head>
</head>
<body onload="hidefield()">
<form action = "test2.php" method = "post">

Please enter a name for the App <input type = "text" name = "name">

<table border = "1"><tr><th>Choose a Label</th><th>Choose an element</th></tr>

<tr><td><input type = "text" name = "label1" /></td> <td> 

<select name = "elementtype1" id="elementtype1" onchange="showfield(this.options[this.selectedIndex].value)">

<option value = 'select'> Select </option>

<option value='txtbox'>Text Box</option>

<option value='lstbox'>List Box</option>

<option value='chkbox'>Check Box</option>

<option value='radio'>Radio Button</option>

</select></td><td><div id="div1">Enter Listbox options: <input type="text" name="whatever1" /></div></td></tr>

</table>

<input type = "submit" value = "Submit">

</form>

</body>

</html>

The code of the loading(AJAX) page is

<html>
<head>
</head>
<body>

<script src="ajax.js" type="text/javascript"></script>
<script src="responseHTML.js" type="text/javascript"></script>

<div id="storage" style="display:none;">
</div>

<div id="displayed">



<FORM name="ajax" method="POST" action="">
    <p>

    <INPUT type="BUTTON" value="Get the Panel"  ONCLICK="loadWholePage('appcreator.php')">

    </p>

</FORM>
</div>



</body>
</html>

The ajax.js code

function createXHR() 
{
    var request = false;
        try {
            request = new ActiveXObject('Msxml2.XMLHTTP');
        }
        catch (err2) {
            try {
                request = new ActiveXObject('Microsoft.XMLHTTP');
            }
            catch (err3) {
        try {
            request = new XMLHttpRequest();
        }
        catch (err1) 
        {
            request = false;
        }
            }
        }
    return request;
}

The responseHTML.js code

function getBody(content) 
{
   test = content.toLowerCase();    // to eliminate case sensitivity
   var x = test.indexOf("<body");
   if(x == -1) return "";

   x = test.indexOf(">", x);
   if(x == -1) return "";

   var y = test.lastIndexOf("</body>");
   if(y == -1) y = test.lastIndexOf("</html>");
   if(y == -1) y = content.length;    // If no HTML then just grab everything till end

   return content.slice(x + 1, y);   
} 

/**
    Loads a HTML page
    Put the content of the body tag into the current page.
    Arguments:
        url of the other HTML page to load
        id of the tag that has to hold the content
*/      

function loadHTML(url, fun, storage, param)
{
    var xhr = createXHR();
    xhr.onreadystatechange=function()
    { 
        if(xhr.readyState == 4)
        {
            //if(xhr.status == 200)
            {
                storage.innerHTML = getBody(xhr.responseText);
                fun(storage, param);
            }
        } 
    }; 

    xhr.open("GET", url , true);
    xhr.send(null); 

} 

    /**
        Callback
        Assign directly a tag
    */      


    function processHTML(temp, target)
    {
        target.innerHTML = temp.innerHTML;
    }

    function loadWholePage(url)
    {
        var y = document.getElementById("storage");
        var x = document.getElementById("displayed");
        loadHTML(url, processHTML, x, y);
    }   


    /**
        Create responseHTML
        for acces by DOM's methods
    */  

    function processByDOM(responseHTML, target)
    {
        target.innerHTML = "Extracted by id:<br />";

        // does not work with Chrome/Safari
        //var message = responseHTML.getElementsByTagName("div").namedItem("two").innerHTML;
        var message = responseHTML.getElementsByTagName("div").item(1).innerHTML;

        target.innerHTML += message;

        target.innerHTML += "<br />Extracted by name:<br />";

        message = responseHTML.getElementsByTagName("form").item(0);
        target.innerHTML += message.dyn.value;
    }

    function accessByDOM(url)
    {
        //var responseHTML = document.createElement("body");    // Bad for opera
        var responseHTML = document.getElementById("storage");
        var y = document.getElementById("displayed");
        loadHTML(url, processByDOM, responseHTML, y);
    }

The script is outside the body tag, and the loader picks out only the code inside the body tag, so the script is not even part of what you add to the page.