Tuesday 15 January 2013

javascript - What is wrong with my simple AJAX example. Does you website have to be on a server? -


I'm not sure all my files are wrong in the same folder. Firstly I will post HTML, then AJAX, and finally the .txt file.

HTML:

  & lt ;; Doctype html & gt; & Lt; Html lang = "en" & gt; & Lt; Top & gt; & Lt; Meta charset = "UTF-8" /> & Lt; Title & gt; The webpage title & lt; / Title & gt; & Lt; Link rel = "stylesheet" type = "text / css" href = "main.css" & gt; & Lt; Script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" & gt; & Lt; / Script & gt; & Lt; Script type = "text / javascript" src = "javascript.js" & gt; & Lt; / Script & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Div id = "mydiv" & gt; & Lt; H2 & gt; AJAX let this text change & lt; / H2 & gt; & Lt; / Div & gt; & Lt; Button onclick = "loadXMLDoc ()" & gt; Change content & lt; / Button & gt; & Lt; / Body & gt; & Lt; / Html & gt;   

and my javascript / AJAX:

  function loadXMLDoc () {var xmlhttp = new XMLHttpRequest (); Xmlhttp.onreadystatechange = function () {if (xmlhttp.readyState == 4 & xmlhttp.status == 200} {document.getElementById ("myDiv"). InnerHTML = xmlhttp.responseText;}} Xmlhttp.open ("GET "," Test.txt ", is true); xmlhttp.send ();}   

and my .txt file:

  & lt; h3 & Gt; This text was changed & lt; / h3 & gt; & lt; p & gt; and I also added a random paragraph & lt; / p & gt;   

Help Thanks in advance.

What do you have with AJX looks great for its first steps But you really need a webserver To make your example work, do the following:

  1. Install a webserver on your machine I suggest you use XAMPP for your first step. Get it here: You should not have to configure something by yourself, just install it and you should end up with a webserver that runs "out-of-the-box".
  2. htdocs < / Code> folders in my example I have HTML f Il ajax.html .
  3. Make sure that your webserver is running, open a browser and go to localhost . You should see a large XAMPP page on it.
  4. Navigate to localhost / ajax.html . I tested your code and it worked.

    Perhaps you can provide more information about AJAX.

No comments:

Post a Comment