0

我做了一个非常简单的 Ajax 测试代码片段：

<!DOCTYPE html>
<html>
    <head>
        <script src='main.js'></script>
    </head>
    <body>
        <button id='get-content'>Click</button>
        <p></p>
    </body>
</html>

main.js

(function(){
    window.addEventListener('load', function(){
        var xml_request = new XMLHttpRequest();
        xml_request.open('GET', '/test.txt', true);
        xml_request.addEventListener('readystatechange', change_content);
        var button_element = document.getElementById('get-content'); 
        button_element.addEventListener('click', fireup(xml_request));
        function fireup(xml_request) {
            xml_request.send();
        }
        function change_content(){
            if (xml_request.readyState == 4 && xml_request.status == 200) {
                document.getElementsByTagName('p')[0].textContent = xml_request.responseText;
            };  
        };
    });
})();

它可以工作，但除了 ajax 请求发送和更改 p 标签，我没有按下按钮，知道吗？

4

2 回答 2

5 
button_element.addEventListener('click', fireup(xml_request));

在这一行中，您调用 fireup(xml_request)，并将它返回的任何内容（无）分配为click事件的侦听器。你可能想要这样的东西：

button_element.addEventListener('click', fireup);
function fireup() { ...

由于xml_request在fireup函数的范围内，因此您无需将其作为参数传递。

于 2012-10-26T09:45:16.637 回答
1

发生这种情况是因为您在添加侦听器时调用它：fireup(xml_request)。它应该是这样的：button_element.addEventListener('click', fireup); function fireup () {...

你也可以使用匿名函数button_element.addEventListener('click', function () {...})

于 2012-10-26T09:46:16.720 回答