Question

我试图使用AJAX在鼠标悬停在图像上时显示html内容。我的代码似乎很好，但似乎没有用。 deakin-campus / discover-deakin是我试图展示的html页面。

下面的代码没有显示任何内容，但是如果我在整个代码中添加一些警报;显示html文本。

<?xml version = "1.0" encoding = "utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>

<script type="text/javascript" >

var asyncRequest;

function getContent(url)
{
    try
    {

        asyncRequest = new XMLHttpRequest();


        asyncRequest.open( 'GET', url, true );


        asyncRequest.send(null);

    asyncRequest.onreadystatechange = stateChange();



    }
    catch (exception)
    {

            alert("error");

    }
}

function stateChange()
{


    if (asyncRequest.readyState == 4 && asyncRequest.status == 200)
    {

        document.getElementById('ContentArea').innerHTML= asyncRequest.responseText;
    }
}

function clearContent()
{
    document.getElementById('ContentArea').innerHTML = '';
}

</script>
</head>

<body>
<img src="deakin-campus.jpg" width="71" height="71"
onmouseover = 'getContent("deakin-campus.html")'
onmouseout = 'clearContent()' />

<img src="discover-deakin.jpg" width="71" height="71"
onmouseover = 'getContent("discover-deakin.html")'
onmouseout = 'clearContent()' />

<div id="ContentArea">&nbsp;</div>
</body>
</html>

Answer 1

传递函数引用...所以没有“（）”。

asyncRequest.onreadystatechange = stateChange;

在调用.send方法之前也这样做。

AJAX鼠标悬停在图像上，显示HTML内容

1 个答案: