Lecția de astăzi se referă la crearea unui formular pentru încărcarea fișierelor pe site utilizând jQuery.
Uneori, formularele pentru descărcarea unei mulțimi de fișiere sunt pur și simplu necesare pentru aplicațiile dvs., dar realizarea acestora nu este o sarcină simplă.
Cu jQuery, acest proces este mult simplificat.
Această lecție va utiliza ultima versiune a cadrului jQuery și pluginul Ajax upload () de la Andrew Valums. Ambele sunt în codul sursă al acestei lecții.
Nu post un demo pentru a nu încărca serverul nostru cu imagini diferite de la utilizatori. Puteți încerca singur - totul funcționează excelent.
Mai întâi, să creăm un buton de descărcare, când faceți clic pe care va deschide dialogul de selectare a fișierelor
Puteți utiliza orice element pentru buton. În exemplul de mai sus, am folosit un div. Au fost aplicate următoarele stiluri:
De asemenea, lângă buton, trebuie să adăugați un element de control pentru a afișa diferite mesaje la momentul încărcării. Pentru a afișa fișierele încărcate către utilizator, a fost adăugată o listă neordonată după buton. Iată codul complet:
Mai jos este un cod PHP simplu care afișează un mesaj "Succes" atunci când este încărcat corect și "Eroare"
Explicarea codului: pentru a utiliza biblioteca AJAX Upload, trebuie să o inițializăm și să îi oferim parametrii. Primul parametru este idul butonului pe care utilizatorul îl va face clic. Al doilea parametru este un script care va face față încărcării. Al doilea parametru poate accepta o serie de opțiuni diferite pentru a oferi mai mult control asupra procesului.
Așa sa făcut.
- acțiune - cale spre scripturile de pe server
- nume - numele căsuței de intrare a fișierului care va fi utilizată pentru încărcare
- onSubmit - vă permite să efectuați funcții înainte de a descărca. De exemplu, puteți verifica extensia de fișier, așa cum sa făcut.
- onComplete - vă permite să efectuați acțiuni după descărcare. De exemplu, afișarea imaginii descărcate către utilizator.
Vă mulțumesc pentru atenție!
Astăzi, vrem să împărtășim câteva idei despre efectul dezvăluirii blocurilor, pe care le puteți utiliza pentru proiectele dvs.
Dacă doriți să îmbunătățiți în mod semnificativ nivelul de securitate al site-ului dvs. pe WordPress, atunci nu puteți evita configurarea fișierului .htaccess. Acest lucru nu numai că vă va proteja de o serie de atacuri de hackeri, ci va organiza și redirecționări, precum și rezolvarea sarcinilor legate de memoria cache.
Designul materialelor este o tendință crescândă de la Google. Această colecție conține teme gratuite pentru WordPress, realizate în acest stil popular.
Efecte asupra acestui lucru și există pentru a impresiona vizitatorii noștri. În această colecție, au fost colectate zeci de resurse, ale căror creatori au încercat foarte mult să-și impresioneze vizitatorii.
La sfârșitul lunii, oferim o selecție de materiale gratuite pentru web designeri pentru ultima lună.
cool, sannyou cred meciul!
>> Nu post un demo pentru a nu încărca serverul nostru cu imagini diferite de la utilizatori. Puteți încerca singur - totul funcționează excelent. Nu am putut învăța o lecție. Ce lecții leagă serverul. Și, în general, permiteți tuturor Google. Codul găsit prin Google funcționează excelent. De obicei, astfel de sisteme de încărcare a fișierelor sunt foarte problematice. După descărcarea pe server, este necesară întotdeauna o configurare lungă, apoi căutarea unui bug, apoi încărcarea cu fișierul, crearea de directoare cu acces special, specificând calea pentru salvarea fișierelor. Făcând toate aceste lucruri doar pentru a vedea cum funcționează codul nu simt cu adevărat ca ea.
stark44
toate lucrările fără configurare, se numește "Nu am încercat, dar nu aprob"
Hmm, Vă recomandăm pe Submite: și voi încărca tot ce vreau!)))
Foarte util script. Vă mulțumesc foarte mult!
Nu funcționează cu noul jQuery 1.6. Cum să tratăm.
Băieți, spune-mi, vă rog să alegeți mai multe fișiere simultan. Vă mulțumim în avans!
Oameni buni, spune-mi cum pot să mă asigur că fișierele sunt încărcate cu nume aleatoare?
$ nume fișier este numele vechi al phallia
Și cum în loc de text: să afișez o imagine a "animației de încărcare"?
Igor Khromenkov
Înlocuiți cu status.html (
Și cum să adăugați în codul JS eliminarea imaginii, când faceți clic pe o anumită pictogramă, după ce este afișată pe onComplete?
spune-mi cum poți să afișezi textul de eroare? și anume pentru a afișa nu numele fișierului care nu sa încărcat, ci mesajul care descrie ce este eroarea
mishakokhanych
Ajutor! cum puteți mări dimensiunea fișierului încărcat. Trebuie să încărc până la 50 MB, nu până la 13.680 de octeți. Vă mulțumim anticipat.
Igor Khromenkov
În script nu există restricții privind dimensiunea maximă a fișierului, încercați să scrieți o urmă. în fișierul .htaccess
Și cum să transferați doi parametri suplimentari de text
i_am_dictator
Te rog ajută. De exemplu, când adăugați un articol, trebuie să atașați un fișier de cuvânt la acesta, am vrut să folosesc acest buton și atunci când îl încarcă fișierul stabilește un link către acest fișier. Ceva de genul asta
do0zy
abayevdv
Mulțumesc. Am avut o mulțime de site-uri, bine, cum ar fi fără o mână - este o rușine să jurați. Și apoi drept și mestecat și în gură. Multumesc in general))))
Scriptul este remarcabil de minunat, totul se încarcă remarcabil, dar fără salvarea datelor în baza de date este inutil.
Vă mulțumesc foarte mult pentru un astfel de script minunat, baza de date a dat seama că înregistrarea se întâmplă. Poate cineva vă va spune unde puteți vedea galeria foto așa cum este făcută în vkontakte?
igormrdoss
El a făcut totul bine, dar lucrează în timp. După actualizarea paginii.
zahermaher
nu funcționează. Toate fotografiile sunt atribuite clasa = "eroare" și nu se încarcă deloc. Ce este în Mozilla, ce este în crom. Vorbesc despre codul sursă.
zahermaher
Și toate au înțeles. calea a trebuit să fie adăugată la upload-file.php și o aveți în codul sursă, cele două etichete de span nu sunt închise în index.html:
Prin obținerea de informații imediat prin două canale (vedere și auz), eficiența predării este mult mai mare decât învățarea din cărți. Și temele și testele online vă vor permite să gândiți în mod constant în limba pe care o învățați și să vă verificați imediat cunoștințele!
Dacă doriți să învățați HTML mult timp, atunci am o veste bună pentru dvs.!
Dacă ați învățat deja HTML și doriți să treceți mai departe, următorul pas este să învățați tehnologia CSS.
Dacă doriți să înțeleagă conceptele de domeniu si hosting, învață cum să creeze o bază de date, încărca fișiere pe un site web prin intermediul unui server FTP, crea subdomenii, configurați cutiile poștale pentru site-ul și să monitorizeze participarea, acest curs este conceput special pentru tine!
Trimiteți-le prietenilor: