Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [AJAX]Menu bez przeładowania strony
Zyggmunt
post
Post #1





Grupa: Zarejestrowani
Postów: 53
Pomógł: 0
Dołączył: 28.04.2009

Ostrzeżenie: (0%)
-----

Witam. Chciałem zrobić stronę, która po wciśnięciu jakiegoś linka z menu wczyta jakiś dokument bez przeładowania całego dokumentu. Użyłem w tym celu AJAX'a, lecz nie mam pojęciu czemu skrypt, który napisałem nie działa:

[XML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2.  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl" dir="ltr">
  3.  <head>
  4.  <title>Moja pierwsza strona w XHTML</title>
  5.  <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8"/>
  6.  <meta http-equiv="Content-Language" content="pl"/>
  7.  
  8.  <style type="text/css">
  9.  #container 
  10.  {
  11.  width: 804px;
  12.  height: 600px;
  13.  margin: 1em auto;
  14.  border: 1px solid red;
  15.  overflow: hidden;
  16.  }
  17.  #menu
  18.  {
  19.  float: left;
  20.  width: 300px;
  21.  border: 1px solid red;
  22.  height: 600px;
  23.  }
  24.  
  25.  #content
  26.  {
  27.  float: right;
  28.  width: 500px;
  29.  height: 600px;
  30.  border: 1px solid red;
  31.  }
  32.  
  33.  </style>
  34.  
  35.  <script type="text/javascript">
  36.  var r;
  37.  var e;
  38.  
  39.  function onClickFunction(link,id)
  40.  {
  41.  if (r = getXMLHttpRequest()) {
  42.  e = document.getElementById(id);
  43.  r = new HMLHttpRequest();
  44.  r.open('GET',link);
  45.  r.onreadystatechange = odbierzDane;
  46.  r.send(null);
  47.  }
  48.  }
  49.  
  50.  function odbierzDane()
  51.  {
  52.  if(r.readyState == 4){
  53.  if(r.status == 200 || r.status == 304){
  54.  e.innerHTML = r.responseText;
  55.  }
  56.  }
  57.  }
  58.  </script>
  59.  
  60.  </head>
  61.  <body>
  62.  <div id="container">
  63.  
  64.  <div id="menu">
  65.  <ul>
  66.  <li><a onclick="onClickFunction('text.xhtml','content');" href="#">Link1</a></li>
  67.  <li><a onclick="" href="#">Link2</a></li>
  68.  </ul>
  69.  </div>
  70.  
  71.  <div id="content">
  72.  
  73.  </div>
  74.  
  75.  </div>
  76.  </body>
  77.  </html>
[XML] pobierz, plaintext


Dokument, który ma się wczytać to:

[XML] pobierz, plaintext 
  1. <?xml version="1.0" encoding="utf-8" standalone="no"?>
  2.  
  3.  <p>Jakis text</p>
[XML] pobierz, plaintext



Proszę o pomoc.

Ten post edytował Zyggmunt 30.05.2009, 21:45:54
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
Zyggmunt
post
Post #2





Grupa: Zarejestrowani
Postów: 53
Pomógł: 0
Dołączył: 28.04.2009

Ostrzeżenie: (0%)
-----

Witam. Mam skrypt:

[XML] pobierz, plaintext 
  1. function submitForm(ktora,naw1,naw2)
  2.     { 
  3.         var req = null; 
  4.  
  5.         
  6.         if(window.XMLHttpRequest)
  7.             req = new XMLHttpRequest(); 
  8.         else if (window.ActiveXObject)
  9.             req  = new ActiveXObject(Microsoft.XMLHTTP); 
  10.                 
  11.                 var e,n;
  12.                 
  13.                 n1 = document.getElementById("nawigacja1");
  14.                 n2 = document.getElementById("nawigacja2");
  15.                 
  16.                 if(naw1 == "none")
  17.                 n1.style.display = "none";
  18.                 if(naw1 == "block")
  19.                 n1.style.display = "block";
  20.                 
  21.                 if(naw2 == "none")
  22.                 n2.style.display = "none";
  23.                 if(naw2 == "block")
  24.                 n2.style.display = "block";
  25.                 
  26.                 e = document.getElementById("szablony");
  27.                 e.innerHTML = "<img id='ladowanie' alt='ladowanie' src='pliki/images/loading.gif' />";
  28.         req.onreadystatechange = function()
  29.         { 
  30.             
  31.             if(req.readyState == 4)
  32.             {
  33.                 if(req.status == 200)
  34.                 {
  35.                     e.innerHTML = req.responseText;    
  36.                 }    
  37.                 else    
  38.                 {
  39.                     e.innerHTML="Error I can't get more galery";
  40.                 }    
  41.             } 
  42.         }; 
  43.         req.open("GET", "pliki/"+ktora, true); 
  44.         
  45.         req.send(null); 
  46.     }
[XML] pobierz, plaintext


Wszystko działa poprawnie, lecz po kliknięciu przycisku cała strona przerzucana jest na początek. Co zrobić aby została w miejscu ? Próbowałem sposobu z tablicami i również ten sam efekt. Możliwe jest też ukrywanie warstw, ale niezbyt mi się to podoba, ponieważ cały czas musi się wczytywać cała strona z każdą warstwą.

P.s. poza tym w Validatorze wyskakuje błąd o następującej treści:

document type does not allow element "img" here …ie' src='pliki/images/loading.gif' />";


The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).
Go to the top of the page
+Quote Post

Posty w temacie
- Zyggmunt   [AJAX]Menu bez przeładowania strony   30.05.2009, 17:29:03
- - skowron-line   Ostatnio dla kogoś z forum napisałem http://skowr...   30.05.2009, 17:32:40
- - Zyggmunt   Chodzi mi raczej o to aby się nauczyć po...   30.05.2009, 21:42:26
- - luniak   Ja osobiście polecam bibliotekę AdvAjax tą samą ...   1.06.2009, 12:13:07
- - kamil4u   a) po co chcesz tak zrobić? Rozwiązanie ...   1.06.2009, 14:39:26
- - skowron-line   Wyższość korzystania z bibliotek jest taka że odch...   1.06.2009, 14:50:27
- - kamil4u   CytatWyższość korzystania z bibliotek jest taka że...   1.06.2009, 14:57:21
- - Zyggmunt   Roumiem, ale tak właściwie to co jest źle w tym pr...   1.06.2009, 16:05:25
- - kamil4u   Dałem Ci kurs - przeczytaj go : Kodif (r...   1.06.2009, 16:50:02
- - Zyggmunt   Witam. Mam skrypt: [XML] pobierz, plaintext funct...   6.06.2009, 19:46:24

« Następny starszy · AJAX · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Przełącz na: Linearny+ · Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 23.08.2025 - 12:27
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn