Question

我实际上不会这么做，我害怕提出这么愚蠢的问题，但我完全不知道这里出了什么问题。

我的JavaScript

function ahah(url, target) {
  document.getElementById(container).innerHTML = ' Fetching data...';
  if (window.XMLHttpRequest) {
    req = new XMLHttpRequest();
  } else if (window.ActiveXObject) {
    req = new ActiveXObject("Microsoft.XMLHTTP");
  }
  if (req != undefined) {
    req.onreadystatechange = function() {ahahDone(url, target);};
    req.open("GET", url, true);
    req.send("");
  }
}  

function ahahDone(url, target) {
  if (req.readyState == 4) { // only if req is "loaded"
    if (req.status == 200) { // only if "OK"
      document.getElementById(container).innerHTML = req.responseText;
    } else {
      document.getElementById(container).innerHTML=" AHAH Error:\n"+ req.status + "\n" +req.statusText;
    }
  }
}

function load(name, div) {
    ahah(name,div);
    return false;
}

我的HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">

    <title>Container</title> 


<!-- GET YOURSELF SOME JAVASCRIPT -- >
    <script type="text/javascript" src="mootools.svn.js"></script>
    <!--script type="text/javascript" src="js/jQuery.js"></script-->    
    <script type="text/javascript" src="js/reflection.js"></script> 
    <script type="text/javascript" src="js/jquery.js"></script>
    <!--script type="text/javascript" src="js/javas.js"></script-->
    <script type="text/javascript" src="js/getstuff.js"></script>
    <script type="text/javascript" src="js/ahah.js"></script>
    <script type="text/javascript">
        window.addEvent('domready', function(){
        var mySlide = new Fx.Slide('top-panel');
        mySlide.hide(); $('toggle').addEvent('click', function(e){
        e = new Event(e);
        mySlide.toggle();
        e.stop();
        });
        });
    </script>

    <!--script type="text/javascript" src="js/request.js"></script-->
</head>
<link rel="stylesheet" type="text/css" href="style.css" />
<body onload="getlogo()">
<div id="top-panel">
    <!-- Top Panel content here -->
    <table class="panel" border="0" width="100%" align="center">
    <tr>
        <td></td>
        <td align="left" width="15%">
            <ul>
                <li>    <a href="index.html" class="panel">Home (F5)</a></li>
                <li>    <a href="#" class="panel" onclick="gettermine()">Termine</a></li>
                <li>    <a href="#" class="panel" onclick="getsomethingelse()">Material</a></li>

            </ul>
        </td>
        <td align="left" width="30%">
            <ul>
                <li>    <a href="#" class="panel" onclick="getsomethingelse()">Flechten mit frischen Weiden</a></li>
                <li>    <a href="#" class="panel" onclick="getsomethingelse()">Flechten mit getrockneten Weiden</a></li>
                <li>    <a href="#" class="panel" onclick="getanfahrt()">Anfahrt</a>    </li>
            </ul>
        </td>
        <td align="left" width="15%">
            <ul>
                <li>    <a href="#" onclick="getsomethingelse()" class="panel">Hauswurz</a> </li>
                <li>    <a onclick="getsomethingelse()" href="#" class="panel">Kontakt</a>  </li>
                <li>    <a onclick="getsomethingelse()" href="#" class="panel">Impressum</a>    </li>
            </ul>
        </td>
        <td align="left" width="15%">
            <ul>
                <li>    <a href="#" onclick="getsomethingelse()" class="panel">Support</a>  </li>
                <li>    <a href="about.html" onclick="load('about.html','container');return false;" class="panel">Profil</a>    </li>
            </ul>
        </td>
    </tr>
    </table>
</div>

<div id="sub-panel">
    <a href="#" id="toggle"><span>Mehr</span></a>
</div>
<!--div id="container"-->
<div id="container">
    <div id="logo">
        <!--img src="img/logo.png"-->
    </div>
    <div align="center" id="tagline">   
        <a onclick="getanfahrt()" class="navlink" href="#">Fricker 1, 88285 Bodnegg</a> | <a href="#" class="navlink" onclick="getkontakt()">07520/914249</a> | <a class="navlink" href=mailto:weidennest@web.de>weidennest@web.de</a>
    </div>
</div>
</body>
</html>

JavaScript 应由链接执行。

<a href="about.html" onclick="load('about.html','container');return false;" class="panel">

但是当点击链接时，没有任何反应。 Firebug说一切都很好。

如果有人会以简短的解释留下答案，那真的很棒！

提前多多感谢！

Answer 1

在你的'ahah'功能中，应该

document.getElementById(container).innerHTML = ' Fetching data...';

要

document.getElementById(target).innerHTML = ' Fetching data...';

Answer 2

当使用innerHTML重新定义页面的某些部分时，您插入页面的HTML部分中包含的<script>标记不会被执行 - 这就是它的样子。

您必须使用其他方式将数据添加到页面;比如DOM操作，例如，我想。

在这个问题下，有一些元素可能会有所帮助：Can scripts be inserted with innerHTML?

Answer 3

稍微更改了函数ahah（）：

function ahah(url, target) {
  document.getElementById(target).innerHTML = ' Fetching data...'; // change container to target
  if (window.XMLHttpRequest) {
    req = new XMLHttpRequest();
  } else if (window.ActiveXObject) {
    req = new ActiveXObject("Microsoft.XMLHTTP");
  }
  if (req != undefined) {
    req.onreadystatechange = function() {ahahDone(url, target);};
    req.open("GET", url, true);
    req.send(null); // sending a GET request - do not send any data.
  }
}

检查是否正确分配了变量“req”并确实发送了AJAX请求。

为什么不执行此JavaScript？

我的JavaScript

我的HTML

3 个答案: