Javascript没有正确执行过程(Javascript not executing procedures correctly)

我正尝试使用JavaScript来处理我正在构建的虚拟网页中的页面内容。

为此，我写了一个名为writeText(file_name, location)的小函数writeText(file_name, location)它获取由文件名指定的HTML文件，并将该文件的内容打印到id属性对应的一对<div>标记的innerHTML中location字段。

然后，我将这些调用封装在其他函数中，以便像这样自动创建整页。

所以我打电话看起来像这样：

function displayHome() { writeText('homeMain.html', 'mainFrame'); writeText('homeSide.html', 'sideFrame'); }

...显示主页。

但是，当我调用这个函数时，显示只会更新'sideFrame'对象，并且不会对'mainFrame'的内容进行任何更改。 但是如果我用两个writeText()调用之间的警报（“虚拟”）中断函数，则两个contentFrames都会正确更新。

我想知道是否有人曾经见过这样的事情，如果有人知道如何解决这个问题。

为了完整起见（这是从w3schools网站几乎逐字地复制）：

function writeText(script_file, location) { if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { document.getElementById(location).innerHTML = xmlhttp.responseText; } xmlhttp.open("GET",script_file,true); xmlhttp.send(); }

I'm trying to use JavaScript to manipulate page content in a dummy webpage I'm building.

To that end, I wrote a little function called writeText(file_name, location) that gets a HTML file specified by the file name, and prints the content of that file to the innerHTML of a pair of <div> tags whose id attribute correspond to the location field.

I then wrapped the calls in other functions to automate building full pages like this.

So I call something that looks like this:

function displayHome() { writeText('homeMain.html', 'mainFrame'); writeText('homeSide.html', 'sideFrame'); }

...to display the home page.

However, when I call this function, the display only updates the 'sideFrame' object and doesn't make any changes to the content of 'mainFrame'. But if I interrupt the function with an alert("Dummy") between the two writeText() calls, then both of the contentFrames update correctly.

I was wondering if anyone has seen anything like this before, and if anyone knows how to fix it.

For completeness' sake (this was copied nearly verbatim from the w3schools website):

function writeText(script_file, location) { if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { document.getElementById(location).innerHTML = xmlhttp.responseText; } xmlhttp.open("GET",script_file,true); xmlhttp.send(); }

最满意答案

你正在使用一个全局变量xmlhttp，所以它在第二次函数运行时被破坏。 请求本身是异步的，所以第二个调用在第一个调用仍在运行时运行。

为了解决这个问题，在xmlhttp之前使用“var”关键字来代替使用局部变量（因此每次调用函数都有自己的xmlhttp）：

var xmlhttp; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); }

You are using a global variable xmlhttp, so it gets clobbered the 2nd time the function runs. The request itself is asynchronous, so the second call runs while the first one is still running.

To fix this, use a local variable instead (so each call to the function has its own xmlhttp) by using the "var" keyword before xmlhttp:

var xmlhttp; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); }Javascript没有正确执行过程(Javascript not executing procedures correctly)

我正尝试使用JavaScript来处理我正在构建的虚拟网页中的页面内容。

为此，我写了一个名为writeText(file_name, location)的小函数writeText(file_name, location)它获取由文件名指定的HTML文件，并将该文件的内容打印到id属性对应的一对<div>标记的innerHTML中location字段。

然后，我将这些调用封装在其他函数中，以便像这样自动创建整页。

所以我打电话看起来像这样：

function displayHome() { writeText('homeMain.html', 'mainFrame'); writeText('homeSide.html', 'sideFrame'); }

...显示主页。

但是，当我调用这个函数时，显示只会更新'sideFrame'对象，并且不会对'mainFrame'的内容进行任何更改。 但是如果我用两个writeText()调用之间的警报（“虚拟”）中断函数，则两个contentFrames都会正确更新。

我想知道是否有人曾经见过这样的事情，如果有人知道如何解决这个问题。

为了完整起见（这是从w3schools网站几乎逐字地复制）：

function writeText(script_file, location) { if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { document.getElementById(location).innerHTML = xmlhttp.responseText; } xmlhttp.open("GET",script_file,true); xmlhttp.send(); }

I'm trying to use JavaScript to manipulate page content in a dummy webpage I'm building.

To that end, I wrote a little function called writeText(file_name, location) that gets a HTML file specified by the file name, and prints the content of that file to the innerHTML of a pair of <div> tags whose id attribute correspond to the location field.

I then wrapped the calls in other functions to automate building full pages like this.

So I call something that looks like this:

function displayHome() { writeText('homeMain.html', 'mainFrame'); writeText('homeSide.html', 'sideFrame'); }

...to display the home page.

However, when I call this function, the display only updates the 'sideFrame' object and doesn't make any changes to the content of 'mainFrame'. But if I interrupt the function with an alert("Dummy") between the two writeText() calls, then both of the contentFrames update correctly.

I was wondering if anyone has seen anything like this before, and if anyone knows how to fix it.

For completeness' sake (this was copied nearly verbatim from the w3schools website):

function writeText(script_file, location) { if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { document.getElementById(location).innerHTML = xmlhttp.responseText; } xmlhttp.open("GET",script_file,true); xmlhttp.send(); }

最满意答案

你正在使用一个全局变量xmlhttp，所以它在第二次函数运行时被破坏。 请求本身是异步的，所以第二个调用在第一个调用仍在运行时运行。

为了解决这个问题，在xmlhttp之前使用“var”关键字来代替使用局部变量（因此每次调用函数都有自己的xmlhttp）：

var xmlhttp; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); }

You are using a global variable xmlhttp, so it gets clobbered the 2nd time the function runs. The request itself is asynchronous, so the second call runs while the first one is still running.

To fix this, use a local variable instead (so each call to the function has its own xmlhttp) by using the "var" keyword before xmlhttp:

var xmlhttp; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); }