Question

我是网络编程的新手，但我必须为大学做一个主页，而且我被困住了。我有一个html文件，使用ajax在div中加载.jsp页面。我有几个加载不同文件的链接。我的问题是当我点击链接时没有响应Firefox（没有错误消息也没有可见活动）。另一方面，在Internet Explorer中，第一个链接（关于我）工作得很好（在div中加载.jsp）。然而，我的第二个链接（照片）应该加载包含javascript的.jsp，并且在任一浏览器上都不起作用。在IE中，.jsp加载但javascript不起作用。我真的很感激一些帮助。这是我的代码：

网主页：

<head>
<title>Titi's HomePage</title>
<link rel="stylesheet" type="text/css" href="homeStyle.css"/>
<script type="text/javascript">
    function loadXMLDoc(file, div)
    {
        if(window.XMLHttpRequest)
        {
            xmlhttp = new XMLHttpRequest();
        }
        else
        {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function()
        {
            if(xmlhttp.readyState == 4 && xmlhttp.status == 200)
            {
                document.getElementById(div).innerHTML = xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET", file, true);
        xmlhttp.send();
    }
</script>
</head>

<body class="body">
<div align="center"><img src="images/header2.jpg" width="1074" height="162" /></div>
<div align="center">
  <table width="1075" height="41" border="1" class="mainTable">
    <tr>
      <th width="215" scope="col"><a href="javascript:loadXMLDoc('http://localhost:8000/HomePage/aboutMe.jsp', 'display');">About Me</a></th>
      <th width="227" scope="col"><a href="javascript:loadXMLDoc('http://localhost:8000/HomePage/Photos.jsp', 'display');">Photos</a></th>
    </tr>
  </table>
  <table class="displayTable">
    <tr>
        <td><div id="display"></td>
    </tr>
  </table>
</div>
</body>

Photos.jsp

<head>
<title>Photos</title>
<SCRIPT language=JavaScript>
theImages = new Array("images/Constanta/c1.jpg", "images/Constanta/c2.jpg", "images/Constanta/c3.jpg","images/Constanta/c4.jpg");
function displayImages() {
for(x in theImages){
    document.write('<img SRC="' +theImages[x]+' " width=80, height =80 onmouseover=addSource(\"'+theImages[x]+'\") onmouseout =removeSource()>');
}
}
function addSource(name){
document.getElementById("biggie").src = name;
var newImg = new Image();
newImg.src = name;
document.getElementById("biggie").height = newImg.height;
document.getElementById("biggie").width = newImg.width;

}
function removeSource(){
document.getElementById("biggie").src = "";
document.getElementById("biggie").height = 0;
document.getElementById("biggie").width =  0;
}
</SCRIPT>
</head>

<body>
<SCRIPT language=JavaScript>
displayImages();
</SCRIPT>
<br/>
<center><img src="" id="biggie" width="0" height="0" align="middle"></center>
</body>

如果我直接加载Photos.jsp然后它可以正常使用IE和FireFox，但不能通过主页的链接。我究竟做错了什么？？请记住，我对此完全陌生，所以请随时指导我：D

提前致谢！

Answer 1

你应该尝试使用这样的东西 - 但我很害羞，这是jQuery最好的解决方案

我调整了代码，所以，现在你有了你需要的东西（比如你建议的功能）。主要问题是回调函数，因为ajax调用是异步的（在jQuery中有可以同步调用的选项），函数在ajax调用完成之前返回未定义的值。

现在，在这个函数中'div'名称作为函数参数传递，因此你不需要函数回调。

此代码在我的计算机上在Firefox 3.6.13中进行了测试

    function isIE(){return/msie/i.test(navigator.userAgent)&&!/opera/i.test(navigator.userAgent);}

function loadXMLDoc(filename, div)
 {
     try
     {
         if (isIE())
         {
             var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
         }
         else
         {
             var xmlhttp = false;
         }
         if (!xmlhttp && typeof XMLHttpRequest != 'undefined')
         {
             try
             {
                 xmlhttp = new XMLHttpRequest();
             }
             catch (e)
             {
                 xmlhttp = false;
             }
         }
         if (!xmlhttp && window.createRequest)
         {
             try
             {
                 xmlhttp = window.createRequest();
             }
             catch (e)
             {
                 xmlhttp = false;
             }
         }
         xmlhttp.open("GET", filename);
         xmlhttp.onreadystatechange = function()
         {
             if (xmlhttp.readyState == 4)
             {
                 document.getElementById(div).innerHTML = xmlhttp.responseText;
             }
         }
         xmlhttp.send(null);
     }
     catch (e)
     {
         alert(e);
     }
 }

html ajax不会在firefox中加载

1 个答案: