Home/ Questions/Q 8733627
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T09:41:16+00:00

I made a very simple Ajax test code snippet: <!DOCTYPE html> <html> <head> <script

  • 0

I made a very simple Ajax test code snippet:

<!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;
            };  
        };
    });
})();

it works, but except, the ajax request send and change the p tag, without I hit the button,
any idea?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team
    button_element.addEventListener('click', fireup(xml_request));

    In this line, you call fireup(xml_request), and assign whatever it returns (nothing) as a listener for the click event. You probably want something like this:

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

    Since xml_request is in scope for the fireup function, you don’t need to pass it as a parameter.

    • 0