dynamiczne wczytywanie zawartości

0

Dobry wieczór.
Mam pewien tekst przeplatany obrazkami, który chcę podzielić na fragmenty i wyświetlać odpowiedni fragment w jakimś pojemniku np

w zależności od tego jaki nr fragmentu zostanie wybrany przez użytkownika. Proces ten ma przebiegać płynnie tzn bez przeładowania strony. Nie wiem w jaki sposób należy coś takiego zrealizować. Czy sformatowany tekst powinienem przechować np. w pliku xml i wczytywać go przy pomocy java script (XMLHttpRequest)?</p>
0

przechowuj go sobie jak chcesz - bylebyś umiał odczytać po stronie javascriptu. no i tak, ajaxem.
nie bardzo rozumiem pytanie. masz problem z wybraniem n-tego diva z tekstu po stronie php/cokolwiek czy z czym konkretnie masz problem. jezeli ostatnie zdanie to wszystko o co pytasz - to odpowiedź już masz :)

0

Czyli jednak ajax...
Ponieważ na razie niewiele przeczytałem o ajax, nie wiem czy mogę w przy użyciu tego zrobić coś takiego:
...

<div id = "container">

 <!-- treść str1 -->
 <div class = "thumbnail>
  <img>jakies img</img>
  <span>jakis podpis</span>
 </div>
 <p>tu wiecej tekstu</p>

</div>

...

mam jakiś plik xml:

<history>

    <page nr = "1">
        <content>
          tutaj treść razem ze znacznikami html, która będzie wczytana i pojawi się wewnątrz div "containter"
        </content>
    </page>
    <page nr = "2">
     itd...

</history>

koncepcja może być czy nie bardzo ?

0

Pewnie, lecz lepiej użyj jakiegoś frameworka, np.jQuery.
Będzie szybciej i łatwiej ;)

0

Przepraszam jeśli pytanie jest nierozsądne, ale czy w związku z tym oznacza to, że ajax ma zdolności "kodotwórcze" i można zastąpić nim np. elementy php?

0

To nie jest jakiś boski twór, hax i jeszcze nie wiem co w jednym tylko zwykła metoda na asynchroniczne pobranie jakiegoś zasobu :|

0

A więc prawie zrobiłem to co chciałem (albo mi się tylko wydaje) bazując na różnych źródłach, ale nie działa to jak należy. Poniżej fragment:

<script type = "text/javascript">

    //obecna strona
    var curr_element = document.getElementById( "1" );

    //wysłanie zapytania
    function Establish_connection( page_nr, page_id )
    {
        var element = document.getElementById( page_id );

        if (element != curr_element)
        {   
            curr_element = element;

            if (window.XMLHttpRequest)
            {
                http_request = new XMLHttpRequest();
                http_request.overrideMimeType( "text/xml" );
            }

            http_request.open( "GET", "historia.xml", true );
            http_request.onreadystatechange = function(){ Load_content( http_request, page_nr ); };
            http_request.send( null );
        }
    }
    //pobranie danych
    function Load_content( http_request, page_nr )
    {
        var element = document.getElementById( "containter" );

        switch (http_request.readyState)
        {
            case 0:
                element.innerHTML = "Wystąpił podczas pobierania danych.";
                break;

            case 1:
                element.innerHTML = "Pobieranie danych ...";
                break;

            case 2:
                break;

            case 3:
                break;

            case 4:
                switch (http_request.status)
                {
                    case 200:
                        //xml
                        var xml_data = http_request.responseXML;
                        var page = xml_data.documentElement.getElementsByTagName("page")[page_nr - 1];
                        element.innerHTML = page.innerHTML; //tu jest problem
                        break;

                    default:
                        alert ("nie ok");
                }

                break;
        }
    }

</script>

metoda page.textContent pobiera sam tekst resztę ignorując, czyli działa prawidłowo
metoda page.nodeValue nie pokazuje nic,
metoda page.innerHTML zwraca undefined

Natomiast ja chciałbym, żeby wyświetlało wszysko czyli obrazki też. Czy to właściwa droga postępowania?

0

Ok, obeszło się bez jquery. Parser nie chciał w żaden sposób odczytać całej struktury html i wszystko interpretował jako tagi xml (zupełnie o tym zapomniałem), a na końcu zostawał tylko czysty tekst. Użycie <![CDATA[ ]]> załatwiło sprawę, ale nie wiem czy to odpowiednie rozw. Można to zrobić poprawniej?

0

No skoro i tak już masz jquery no to tam są świetne funkcje load lub bardziej rozbudowany ajax, które upraszczają korzystanie z ajaxa o 300%, jak nie więcej.

http://api.jquery.com/jQuery.ajax/

1

niektórzy lubią sobie utrudniać, zamiast 5 prostych linijek ma 80 których nie rozumie.

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0