Calling .js file from HTML using AJAX

genius

this js is at index.html between "<script type="text/javascript">"

function callanular() {

        peticion_http = new XMLHttpRequest();

        peticion_http.onreadystatechange = showContent;

        peticion_http.open('GET', 'anular.js', true); 
        peticion_http.send(null);                       


        function showContent() {

            if(peticion_http.readyState == 4) {

                if(peticion_http.status == 200) {

                    document.getElementById("notice").innerHTML=peticion_http.responseText;

                }
                else
                    document.getElementById("notice").innerHTML="ERROR "+peticion_http.status;
            }
        }
    }

index.html HTML code I have, looking to show box on div with id=notice

<div id="notice"></div>
<input type="submit" value="RESTRICTED ACCESS" onclick="callanular()">

At the same folder I have anular.js created, I want to show a simple box with a text, in this case I only have an alert to know it's working.

window.onload = function() {
    return (alert("asdasdsa"));
}

Whatever I write I can only receive the literally code. e.g.

window.onload = function() {return (alert("asdasdsa")); }

genius

So this is how I solved it by using Jquery in first case, AJAX in second case.

First Case

Javascript code on index.html

function callanular() {

        $.getScript("anular.js", function(){
            //You can write an alert or something
            //In my case it wasn't necessary.
        });
    }

anular.js content

document.getElementById("notice").innerHTML = "<div id='nopul' onclick='getText()'>YOU SHOULDN`T PRESS THIS BUTTON</div><br>";

Back to index.html where I got:

<div id="notice"></div> //here anular.js is going to show the div box
<input type="submit" value="RESTRICTED ACCESS" onclick="callanular()">

At that point it was working fine as I wanted. So I added AJAX to get text from txt file simply doing a call to

XMLHTTPRequest();

peticion_http.open('GET', 'text.txt', true);

-

Second Case anular.js file

<div id='nopulses' onclick='getTexto()'>YOU SHOULDN`T PRESS THIS BUTTON</div><br>

index.html javascript code

        peticion_http = new XMLHttpRequest();

        peticion_http.onreadystatechange = showContent;

        peticion_http.open('GET', 'anular.js', true);  
        peticion_http.send(null);                       

        function muestraContenido() {

            if(peticion_http.readyState == 4) {

                if(peticion_http.status == 200) {

                    document.getElementById("notice").innerHTML=peticion_http.responseText;

                }
                else
                    document.getElementById("notice").innerHTML="ERROR 404 Not Found "+peticion_http.status;
            }
        }

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

Calling a Javascript function from an external js file in the html file

From Dev

Why AJAX dont´t pass value of name from html File-(JS part) to PHP File using POST?

From Dev

Calling other js file function into AJAX call

From Dev

Calling a php function in a separate file using AJAX

From Dev

Calling server method opening file from AJAX

From Dev

Download file using html returned from ajax call

From Dev

Get html file from a given url using javascript($ajax)

From Dev

Using AJAX & jQuery to pull in certain HTML elements from external file

From Dev

calling servlet from php page using ajax

From Dev

Sending data from .js file to .php using ajax

From Dev

Send a CSV file from Ember Js to Rails using Ajax

From Dev

POST method not working in .NET Core MVC while using Jquery , AJAX for calling api from View(html page)?

From Dev

Issue with calling a javascript file from a HTML page

From Dev

Calling a function from HTML to Python file

From Dev

Calling JS function using a link in html

From Dev

Vue - calling REST API from js file

From Dev

Calling npx from a node.js file

From Dev

Calling method from compiled js file

From Dev

Calling Routes from a js angular 1.5.8 file

From Dev

Calling a function from a JS file not working

From Dev

Calling file from remote directory using powershell

From Dev

Display data in html/js file using NodeJs from mysql database

From Dev

Directory structure issue when calling a JS file and Ajax

From Dev

WP / Ajax | Jquery Dropzone js file Upload Calling twice Request

From PHP

AJAX not calling PHP file

From Dev

Grid box displaying wrong while calling HTML data using AJAX

From Dev

Ajax calling controller to send a html table of objects form from view

From Dev

Calling a php file within a html file using javascript

From Dev

HTML added from another HTML file using JS displays correctly, but JS functions do not work

Related Related

  1. 1

    Calling a Javascript function from an external js file in the html file

  2. 2

    Why AJAX dont´t pass value of name from html File-(JS part) to PHP File using POST?

  3. 3

    Calling other js file function into AJAX call

  4. 4

    Calling a php function in a separate file using AJAX

  5. 5

    Calling server method opening file from AJAX

  6. 6

    Download file using html returned from ajax call

  7. 7

    Get html file from a given url using javascript($ajax)

  8. 8

    Using AJAX & jQuery to pull in certain HTML elements from external file

  9. 9

    calling servlet from php page using ajax

  10. 10

    Sending data from .js file to .php using ajax

  11. 11

    Send a CSV file from Ember Js to Rails using Ajax

  12. 12

    POST method not working in .NET Core MVC while using Jquery , AJAX for calling api from View(html page)?

  13. 13

    Issue with calling a javascript file from a HTML page

  14. 14

    Calling a function from HTML to Python file

  15. 15

    Calling JS function using a link in html

  16. 16

    Vue - calling REST API from js file

  17. 17

    Calling npx from a node.js file

  18. 18

    Calling method from compiled js file

  19. 19

    Calling Routes from a js angular 1.5.8 file

  20. 20

    Calling a function from a JS file not working

  21. 21

    Calling file from remote directory using powershell

  22. 22

    Display data in html/js file using NodeJs from mysql database

  23. 23

    Directory structure issue when calling a JS file and Ajax

  24. 24

    WP / Ajax | Jquery Dropzone js file Upload Calling twice Request

  25. 25

    AJAX not calling PHP file

  26. 26

    Grid box displaying wrong while calling HTML data using AJAX

  27. 27

    Ajax calling controller to send a html table of objects form from view

  28. 28

    Calling a php file within a html file using javascript

  29. 29

    HTML added from another HTML file using JS displays correctly, but JS functions do not work

HotTag

Archive