Încărcarea dinamică a conținutului ajax

Astăzi, vom afla cum să folosim ajax-jQuery pentru a încărca conținut făcând clic pe link. Să presupunem că trebuie să luăm conținutul din legătură și să-l încărcăm în container.







Mai întâi, creați un link și un container la care vom fi încărcați cu toții.

Mai jos, scriem următorul scenariu.

Acum vom analiza codul nostru, când facem clic pe link-ul, o ajax-request apare, în fișierul content.php. De asemenea, indicăm faptul că cache-ul fișierelor este interzis. Înainte de a trimite (evenimentul anteriorSend), mesajul "Obțineți conținut" apare în container, când cererea este finalizată (evenimente de succes), conținutul fișierului content.php este plasat în container.

return false; specificăm pentru a ne asigura că atunci când faceți clic pe nu faceți clic pe link, în acest caz prin # (astfel încât să nu existe salt de pagină).

Este atât de ușor să obțineți conținut cu jQuery.

(Vizitată de 10 ori, de 1 ori astăzi)

Probabil veți fi interesați:

Nu ceea ce mă așteptam. Construcția de mai sus pentru blocurile N div este copia N-fold? Dați un exemplu pentru blocurile N cu url diferit și diferit: '/your-script.php?parametr=1'?

Anume: avem nevoie de un singur JS (al tău, dar modificat) care, atunci când "întâlni" o construcție a formei
...

Va ascunde și va afișa conținut din /your-script.php?parametr=N

Nu ceea ce mă așteptam. Construcția de mai sus pentru blocurile N div este copia N-fold? Dați un exemplu pentru blocurile N cu url diferit și diferit: '/your-script.php?parametr=1'?

Și anume, ai nevoie doar de JS (dar dvs. modificat), care, atunci când tipul de "întâlnire" de proiectare div id = »getContentA» a href = »/ ta-script.php parametr = A» / a / div div id = »getContentB» o? href = "/ your-script.php? parametr = B" / a / div
...
div id = »getContentN» a href = »/ your-script.php? parametr = N» / a / div

Va ascunde A / a și va afișa conținutul din /your-script.php?parametr=N

și l-au răsucit până la linie
$ ("# Feeds"). Încărcați ("pages / demo.html #areaa");
nu a început să funcționeze
În final, am obținut acest lucru:

Și asta este ceea ce am nevoie, ca să pot descărca cu ușurință informații din containere cu același id pe o singură pagină.
Rămâne doar să învățăm să ne amintim când reîncarcă informațiile paginii, pentru a nu face clic pe link-ul din nou, acesta este momentul în care încă nu-mi imaginez cum să pun în aplicare;)

Bine ai venit!
Sunt deja epuizat căutând codul de care am nevoie. Poate mă poți ajuta ...

Am nevoie doar de 2 lucruri:
1. Există o diva pe pagina care urmează să fie actualizată fără a reporni după un anumit interval de timp specificat, precum și comenzi script-ul, adică există un script care ar trebui să ruleze funcția de actualizare a divs.
2. De asemenea, informațiile din aceste divas ar trebui să fie încărcate prin elementele de meniu, se presupune că navigarea fără a reporni acolo capace, subsol etc.

Dar un lucru pe care nu am kakraz și nu pot găsi în divah informații ar trebui să fie actualizate ceea ce este, adică nici un fișier pentru a fi încărcate nu ar trebui ... doar el însuși dive este actualizat și toate ... Dar când meniul, apoi divele pot fi încărcate de pe fișiere, dar apoi trebuie să fie din nou actualizat de mașina automată și script-ul de pe apelul de funcții.

Te rog ajută, dacă poți. a aruncat o grămadă de site-uri, dar peste tot este încărcat doar fișierul ... ((((

Problema este că încercați să găsiți, nu încercați să scrieți cod. Și vă asigur, dacă nu schimbați tactica, atunci problemele vor rămâne.

Mulțumesc, desigur, răspunsului, dar m-am bazat pe ajutor real.
Eu pur și simplu mai ușor pe baza unor exemple gata făcute pentru a ajusta codul pentru a se potrivi nevoilor dumneavoastră, dar în cazul meu, toate codurile de pe fișierele Inchizitorul lui, și nu reușește să se adapteze sarcina mea la alta, iar aceste coduri ...
Și, în cele din urmă, dacă aș putea scrie cod, vă asigur că nu aș aplica pentru ajutor!
Îmi pare rău că te deranjez.

Dacă ați încercat să scrieți ceva și nu ați fi reușit. Și întrebarea a fost următoarea: Cum se face o actualizare a divs prin interval, atunci ajutorul ar fi diferit.
Și tu îmi ceri să scriu o piesă din site-ul tău de lucru pentru tine.

Ce întrebare, cum ar fi și răspunsul.







Exemplele nu trebuie personalizate. Exemple sunt create pentru a le înțelege.

Vă mulțumim pentru exemplu. Dar am o problemă. Să presupunem că există două butoane. Fiecare încarcă conținutul dintr-un fișier care conține diferite scripturi Java cu o prezentare de diapozitive. Când încărcați întreaga pagină, apare prima expunere de diapozitive. Dar când a doua sarcină nu funcționează, atunci și prima nu funcționează. Se pare că scripturile din interiorul conținutului încărcat sunt ignorate și numai conținutul static este dat. Cum de a rezolva problema cu scripturile din conținutul descărcat?

Prin urmare, am sugerat că acest lucru se poate face adăugând codul pe tema WP

Bună ziua! A doua zi mă lupt pentru sarcină, și în cele din urmă aproape că am rezolvat-o cu ajutorul dvs. :)
Aveam nevoie ca scriptul php să fie încărcat în formularul selectat, tragând valorile corespunzătoare din baza de date. ... Dar captura este faptul că datele sunt încărcate în formă de doar o singură linie (și ar trebui să fie sub forma unei liste, și chiar că fiecare element are o valoare diferită).
Fișier sursă:
Încărcarea scriptului

Ce este încărcat:
echo mysql_result ($ rezultat, $ j, 'district');
Dar este necesar:
echo '------ nbsp'. mysql_result ($ rezultat, $ j, 'district'). "; // (pentru ca opțiunea să fie aici, nu pe pagina sursă)
Dacă id-ul atribuie selectați - nimic nu funcționează ...
Voi fi foarte recunoscător pentru ajutor :)

$ ('' Item ') Faceți clic pe (funcția () $ (this) .removeClass (' active ');
$ (acest) .addClass ("activ");
$ ('# Conținut'). Încărcați ($ (acest));

Am vrut să vă asigur că când ați făcut clic, paginile încărcate în aceeași fereastră și acestea sunt încărcate numai într-o fereastră nouă.
Ce am făcut greșit?

Asta este, atunci când fac clic, un div dispare (așa conceput), și când fac clic din nou, este ceva de genul comutare între moduri.

Deci, când adaug id = "getContent", atunci ceea ce este responsabil pentru încărcarea datelor în div, nimic nu funcționează. Și invers. Cum îi fac să lucreze simultan?

aici este funcția de jos

funcția în jos ()
var obj = document.getElementById ("modul");
dacă (obj.style.display == 'bloc')
obj.style.display = 'nici unul';
altfel
obj.style.display = 'bloc';
>

funcția down5 ()
var obj = document.getElementById ("modul");
dacă (obj.style.display == 'bloc')
obj.style.display = 'nici unul';
altfel
obj.style.display = 'bloc';
>

$ (document) .ready (functie () $ ('# getContent') click (function () $ .ajax (url: «load.php»,
cache: false,
înainteSend: funcția () $ ('# divContent') html ('Așteptați puțin');
>
succes: funcția (html) $ ("# divContent"). html (html);
>
>);
return false;
>);
>);

Asta este, atunci când fac clic, ascund un div și încărcați conținutul în altul. Dar împreună nu vor să muncească! Când apăsați din nou, primul div trebuie să apară înapoi și să se ascundă (nu puteți afișa nici unul, nu mai puteți obține) al doilea. Cum le pot combina, spune-mi, te rog.

Spuneți-mi despre întrebarea mea, pe care am întrebat-o mai sus.

Dacă eliminați codul, care încarcă conținutul în aceeași pagină, atunci paginile sunt deschise, desigur într-o fereastră nouă și nu în aceeași pagină.

Totul ar trebui să funcționeze, să pună un FireBug sau în Opera să fie o libelule. Probabil că aveți adrese URL nevalide pe aceste pagini, încercați să dezactivați javascript și să verificați dacă linkurile funcționează.
Rețineți că interogările inter-domeniu javascript sunt interzise și nu puteți încărca.

După cum am scris deja, fără script-ul dvs., toate linkurile funcționează așa cum ar trebui, însă numai într-o fereastră nouă, cum ar trebui să fie).
Nu mă înțeleg.
În opera a funcționat, odată ce a fost activată AllowFileXMLHttpRequest.

Și cromul care scrie aici

XMLHttpRequest nu se poate încărca

Originea null nu este permisă de Access-Control-Allow-Origine.

O zi bună, am văzut că ai o întrebare ca a mea, dar nu am găsit un răspuns la ea ...
Încărc pe pagina ajaksom tabelul care generează php:
$ (document) .ready (funcție () $ .ajax (url: "mkr8.php",
cache: false,
dateType: "html",
succes: funcția (aaa) $ ("# tables"). html (aaa);
>
>);
>);

totul este încărcat, dar toate celelalte scripturi sunt pe pagină (inclusiv cele din același $ (document) .ready). Nu lucrați pentru conținutul descărcat. Mulțumită în avans.

Trebuie să descărcați scripturile în prealabil. Și la elementele încărcate pentru a aborda prin.

Am pus acest cod pe wordpress, când îl fac clic, am încărcat conținut, dar nu se întâmplă nimic. Încerc să conectez o pagină statică de tip wordpress

Vedeți ce eroare vylazyat. În wordpress, jquery este deja conectat.

Aici puteți urmări lucrarea în albume tematice.

face
printf ("% s", $ myrow3 ["title"]);
>
în timp ce ($ myrow3 = mysql_fetch_array ($ result3));

$ (Document) .ready (funcția () $ ( '# getContent') clic (funcția () $ .ajax (URL :. «/content.php»,
cache: false,
înainteSend: funcția () $ ('# divContent'). html ('Obțineți conținut');
>
succes: funcția (html) $ ("# divContent"). html (html);
>
>);
return false;
>);
>);

și anume o listă de mini-imagini (galerie).

Ajutor, te rog. Vă mulțumim anticipat pentru răbdarea și sfaturile dumneavoastră. Am anexat o bucată de cod -

face
printf ("% s", $ myrow3 ["title"]);
>
în timp ce ($ myrow3 = mysql_fetch_array ($ result3));

$ (Document) .ready (funcția () $ ( '# getContent') clic (funcția () $ .ajax (URL :. «/content.php»,
cache: false,
înainteSend: funcția () $ ('# divContent'). html ('Obțineți conținut');
>
succes: funcția (html) $ ("# divContent"). html (html);
>
>);
return false;
>);
>);

Ne pare rău, clarificări - în fișierul content.php Am o cerere în baza de date pentru scoaterea mini-imagini din tabelul de imagini cu construirea unei liste de miniaturi. Cum se face scriptul să funcționeze?

MULȚUMESC încă o dată.

Bine ai venit! Multe mulțumiri pentru scenariu.
Dar ajută-mă, vă rog, cu o altă sarcină, esența este următoarea:
Ați încărcat conținutul în div cu clic.
Dar nu am nevoie doar de clic, ci și de hover, există o mică diferență în stiluri, adică când plasați cursorul, conținutul este tăiat, iar când faceți clic pe el, derularea apare în partea dreaptă.







Trimiteți-le prietenilor: