Forum PHP.pl > [jquery][ajax] załadowanie jednego elementu z innego pliku html

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [jquery][ajax] załadowanie jednego elementu z innego pliku html

Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript

5skakanek

7.04.2011, 17:43:35

Mam stronę główną "index.html" której jednym z elementów jest

[HTML] pobierz, plaintext 
<div id="content"></div>
[HTML] pobierz, plaintext

oraz plik - "tresc.html" - gdzie znajdują się

[HTML] pobierz, plaintext 
<!DOCTYPE HTML>
<html>
<head>
<meta content="charset=utf-8">
</head>
<body>
<div id="txt1">tekst 1</div><div id="txt2">tekst 2</div><div id="txt3">tekst 3</div>
</body>
</html>
[HTML] pobierz, plaintext

Chciałbym aby po kliknięciu linku w "index.html" załadować do niego element np

[HTML] pobierz, plaintext 
<div id="txt2">tekst 2</div>
[HTML] pobierz, plaintext

z pliku "tresc.html" jednak bez pozostałych informacji. Pliki znajdują się w tej samej lokalizacji. Czy jest jakiś sposób, żeby zrobić to z pomocą jquery/ajax?
Czekam na odp i pozdr - 5s
PS: To mój pierwszy post tutaj - więc w razie czego proszę o wyrozumiałość (mam nadzieję, że niczym nie zgrzeszyłem:) - informacji tej szukam od 2 dni.

krowal

7.04.2011, 20:26:31

Przy evencie success swojego ajaxowego wywołania daj coś takiego:

[JAVASCRIPT] pobierz, plaintext 
var regexp = new RegExp('<div.*?id="txt1">.*?</div>', 'is');
var data = regexp.exec(msg); //msg to kod ze strony tresc.html zaladowany ajaxem
alert(data[0]); // w data[0] będziesz miał swojego diva
[JAVASCRIPT] pobierz, plaintext

Trochę dziwną drogę do tego wybierasz, ale jak nie możesz inaczej to zrób tak

Życzę miłego pobytu na forum.

cim

7.04.2011, 21:16:47

Witam,

może spróbuj czegoś takiego:

Kod

$('#result').load('tresc.html #txt2');

wtedy jQuery pobierze dokument z linka i sprawdzi go pod kątem selektora, który podajesz po spacji, więcej: http://api.jquery.com/load/ -> Loading Page Fragments

Pozdrawiam

krowal

8.04.2011, 07:01:46

@cim twój sposób jest lepszy, nie wiedziałem, że można tam selektorów używać

5skakanek

8.04.2011, 11:18:22

No jasne, wystarczyło wejść na API jQuery; ) Ale nie przyszło mi do głowy, że load(); wykorzystuje tak banalne rozwiązania. Dzięki chłopaki za oba sposoby!
Robię to w ten sposób, żeby ubezpieczyć stronę w przypadku braku obsługi skryptów i dla robotów - jeśli skrypty są obsługiwane, wyniki ładują się na str głównej a jeśli nie - link prowadzi do podstrony z własnymi stylami, formatowaniem i linkami ale z tą samą treścią. Dzięki temu nie muszę tworzyć dwóch oddzielnych plików z takim samym tekstem.

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.