Tranziție automată la pagina html. Redirecționarea către o altă pagină utilizând JavaScript

Să presupunem că doriți să afișați pagina https://example.com/final.php utilizatorilor care merg la pagina https://example.com/initial.php. Acest lucru se poate face cu câteva metode PHP, JavaScript și HTML. În acest articol, vom acoperi fiecare dintre metodele pe care le puteți utiliza pentru a redirecționa PHP către o altă pagină.

Iată câteva variabile pe care le vom folosi:

Folosind funcția Antetul PHP() pentru a redirecționa adresa URL

Dacă doriți să adăugați o redirecționare de la initial.php la final.php , puteți plasa următorul cod pe pagina web initial.php. Trimite un nou antet de locație către browser:

Aici folosim funcția PHP header() pentru a crea redirecționarea. Trebuie să plasați acest cod înaintea oricărui cod HTML sau text. În caz contrar, veți primi un mesaj de eroare că antetul a fost deja trimis. De asemenea, puteți utiliza tamponarea de ieșire pentru a preveni această eroare de trimitere a antetelor. În exemplul următor aceasta metoda Redirecționări PHP afișate în acțiune:

Pentru a efectua o redirecționare folosind funcția header(), funcția ob_start() trebuie să fie prima funcție din scriptul PHP. Acest lucru va preveni apariția erorilor de antet.

Ca măsură suplimentară, puteți adăuga die() sau exit() imediat după redirecționarea antetului, astfel încât restul codului paginii web să nu se execute. In unele cazuri roboți de căutare sau este posibil ca browserele să nu acorde atenție antetului Locație. Care sunt potențialele amenințări la adresa securității site-ului:

Pentru a fi clar: die() sau exit() nu au nimic de-a face cu redirecționările. Sunt folosite pentru a preveni executarea restului codului de pe pagina web.

Când redirecționați către o pagină în PHP, este recomandat să utilizați adrese URL absolute atunci când specificați valoarea antetului Locație. Dar și adresele URL relative vor funcționa. De asemenea, puteți utiliza această funcție pentru a redirecționa utilizatorii către site-uri externe sau pagini web.

Ieșirea codului de redirecționare JavaScript folosind funcția PHP echo().

Aceasta nu este o soluție PHP pură. Cu toate acestea, este și eficient. poți să folosești Funcția PHP echo() pentru a scoate codul JavaScript care se va ocupa de redirecționare.

Dacă utilizați această soluție, nu va trebui să utilizați tamponarea de ieșire. Acest lucru previne, de asemenea, erori legate de trimiterea antetelor.

Mai jos sunt câteva exemple care folosesc diferite Metode JavaScript a redirecționa de la pagina curenta altcuiva:

Singurul dezavantaj al acestei metode de redirecționare către un alt site PHP este că JavaScript rulează pe partea clientului. Și vizitatorii dvs. pot avea JavaScript dezactivat.

Utilizarea metaetichetelor HTML pentru redirecționare

De asemenea, puteți utiliza HTML de bază pentru a efectua redirecționarea. Poate părea neprofesionist, dar funcționează. Și nu trebuie să vă faceți griji că JavaScript este dezactivat în browser sau că ați trimis anterior o eroare de antet:

De asemenea, puteți utiliza ultima linie din exemplul anterior pentru a reîmprospăta automat pagina la fiecare „n” secunde. De exemplu, următorul cod va reîmprospăta automat pagina la fiecare 8 secunde:

Concluzie

În acest articol am tratat trei diverse metode redirecționează de la index php, precum și avantajele și dezavantajele acestora. Metoda specifică de utilizat depinde de obiectivele proiectului.

Traducerea articolului „Cum pot face o redirecționare către o adresă URL diferită înainte de încărcarea paginii în PHP” de către echipa prietenoasă de proiect.

Rău Bun

O zi bună tuturor, dragii mei prieteni și cititori. Sper că te-ai hotărât să participi la competiția mea și deja scrii despre călătoria ta de blogging. Ei bine, aș dori să ne continuăm studiul limbaj html iar astăzi aș vrea să vă povestesc despre una dintre cele mai importante componente și anume hyperlink-urile.

Da, fără astfel de hyperlinkuri, internetul nu ar fi atât de convenabil. Nu, mint. Nu ar fi deloc ușor de navigat. Vă puteți imagina internetul fără ele? Eu personal nu.

Și astăzi vom învăța cum să inserăm un hyperlink în html. Dar mai întâi aș dori să vă întreb: știți ce este un hyperlink și cum diferă de un link obișnuit? Totul este de fapt simplu aici: un link este o simplă informație care se referă la un document. În același timp, nu poți da clic pe acest text (nu se va întâmpla nimic), dar știi unde să cauți informații.

Exemplu: puteți afla cum să evidențiați părul în Photoshop la //site/adobe-photoshop/kak-vydelit-volosy/

Un hyperlink este același text, doar că esența lui este că poți să dai clic pe acest text și să ajungi la pagina, site-ul sau orice alt obiect dorit. Mai mult decât atât, textul în sine poate fi orice, în timp ce adresa este scrisă separat în interior și poate fi complet diferită. Dar oricum ar fi, în vorbirea colocvială se mai numesc pur și simplu legături. Iată un exemplu de hyperlink:

Puteți citi despre cum să evidențiați corect părul în Photoshop într-unul dintre tutorialele mele.

Oricum. Bună teorie. Acum să trecem la practică și să vedem care sunt responsabili pentru toate aceste chestiuni.

Responsabil pentru hyperlink etichetă asociată, dar în sine nu reprezintă nimic. Merge întotdeauna în legătură cu un atribut. Și în acest caz, trebuie să scriem constant același href. În valoarea atributului punem link-ul către resursa dorită în sine. Și în conținutul însuși scriem textul însuși, care ar trebui să devină clicabil (funcționează atunci când se face clic). Uită-te la exemplu și cred că vei înțelege totul.

Motorul de căutare Yandex

După cum înțelegeți, în acest exemplu am scris că atunci când faceți clic pe o bucată de text „ Sistem de căutare Yandex”, persoana va fi direcționată către adresa scrisă în valoarea atributului href.

Cred că mulți dintre voi știți că există legături interne și externe. Legăturile interne se desfășoară într-un singur director, adică site-ul, iar linkurile externe duc la o resursă terță parte. Și acum vă voi arăta cum să le faceți pe amândouă.

Fișier în același folder

Dar o astfel de tranziție va funcționa cu condiția ca fișierul la care faceți legătura să fie localizat în același folder cu fișierul în care plasați legătura. Pentru alte opțiuni, totul este puțin diferit.

Fișier într-un alt folder

Deschideți fișierul pushkin.html în Notepad++

Acum găsiți cuvântul fotografie și înfășurați-l în etichete.

Acum atentie! În valoarea atributului specificăm calea relativă la fișierul care se editează, adică pushkin.html însuși. Ar trebui să ajungi cu ceva de genul acesta:

Fotografie

Ce am făcut acum? Și am făcut următoarele: deoarece calea către fotografie constă în folder separat img, care se află în același folder cu fișierul pushkin.html, apoi în valoarea atributului trebuie să scriem mai întâi numele folderului, iar apoi, printr-o bară oblică (/), numele complet al documentului (în cazul nostru, fotografii).

Acum salvați și rulați fișierul pushkin.html în browser. Veți vedea că cuvântul „Foto” a devenit evidențiat în albastru și a devenit clicabil, ceea ce înseamnă că făcând clic pe acest link vom fi duși la fișierul fofo.jpg, care se află în folderul img.

Așa cum? Tot clar? Dacă se întâmplă ceva, nu ezitați să întrebați.

Tranziții externe

Și bineînțeles, nu putem să nu menționăm link-uri externe, după ce facem clic pe care vom fi duși către un cu totul alt site. Dar nu este nimic complicat aici. Ideea este că puneți adresa completă a site-ului sau a paginii web în valoarea href. Am arătat un exemplu cu Yandex mai sus. Dar iată un alt exemplu:

Voi studia pentru a deveni un maestru al proiectelor sociale.

Aici ajungem pagina specifică site specific.

Se deschide într-o fereastră nouă

În mod implicit, când faceți clic pe un link, documentul se deschide în aceeași fereastră cu pagina dvs., de exemplu. pagina ta se va închide. Și asta nu este bine. În special, pentru proiectele de conținut promovat sau bloguri, se recomandă ca atunci când dați clic pe un link, documentul să se deschidă într-o fereastră sau filă nouă fără a vă închide pagina.

Atributul țintă cu valoarea „_blank” ne va ajuta în acest sens. Nu este nimic complicat aici. Va trebui doar să introduceți acest lucru în interiorul etichetei de deschidere după valoarea atributului href. Să luăm acel fragment din fișierul lukomorye.html, unde am făcut un link către pagina pushkin.html, abia acum vom scrie tocmai acest atribut. Ar trebui să arate așa:

Din poemul Ruslan și Lyudmila (Autor - A.S. Pușkin)

Ei bine, totul este clar aici. Acum, când dați clic pe conținut pagina dorită se deschide într-o fereastră nouă. Acest lucru este foarte necesar, deoarece dacă nu îl înregistrați, utilizatorul va părăsi pur și simplu pagina dvs. Și așa, în orice caz, va rămâne pe el, doar dacă nu îl închide în mod specific. Încercați să faceți totul singur, doar să faceți totul frumos cu propriile mâini. Nu este nevoie să copiați și să lipiți.

Cumva așa. Se pare că ți-am spus toate cele mai importante lucruri, dar dacă vrei să mergi în această direcție și să înveți HTML și CSS pentru a crea site-uri web profesionale, bloguri și chiar magazine online, atunci asigură-te că urmărești un curs video excelent pe această temă. Lecțiile sunt cu adevărat excelente și sunt într-adevăr spuse pentru oamenii care sunt încă puțin familiarizați cu construirea site-ului web sau nu sunt familiarizați deloc.

Ei bine, asta încheie lecția noastră de astăzi. Sper că ți-a plăcut articolul meu și te vei bucura dacă vei deveni cititorul meu obișnuit. Așa că nu uitați să vă abonați la actualizările blogului meu pentru a nu pierde nimic interesant. Ei bine, vă doresc succes în toate eforturile voastre. Pa! Pa!

Cu stima, Dmitri Kostin.

ÎN această lecție vom vorbi despre cum să faci un link în HTML. Link-urile sunt foarte des folosite pe site-uri web, acestea vă permit să treceți de la o pagină a unui site web la alta. Particularitatea link-urilor este că pot duce nu numai la o pagină web, ci și la fișiere, imagini etc.

Legăturile pot fi interne și externe. De link-uri interne se realizează tranziția la pagini și fișiere dintr-un singur site. linkuri externe conduce la site-uri, documente și fișiere terțe. În același timp, aceste tipuri de legături sunt setate aproape identic.

Cum să faci un link în HTML, exemple

1. HREF - este responsabil pentru unde ar trebui să ducă legătura. Link standard este specificat după cum urmează: Text link.

2. ȚINTĂ - este responsabil pentru fereastra în care se va deschide documentul. Mod implicit document nou se deschide în fereastra curentă a browserului. Atributul „țintă” vă permite să deschideți un link într-o nouă fereastră de browser. Acest atribut are urmatorii parametri:

• _blank - încarcă pagina într-o fereastră nouă;
• _self - încarcă pagina în fereastra curentă;
• _parent - încarcă pagina în cadrul părinte;
• _top - anulează toate cadrele și încarcă pagina într-o fereastră nouă.

3. NUME - folosit pentru a naviga într-o anumită zonă din pagină. După simbolul hash, acesta este indicat între ghilimele cuvânt cheie(marcaj sau etichetă). Pentru a accesa această etichetă, utilizați linkul în care este scrisă această etichetă.

Exemplu de link extern

Accesați site-ul web

Accesați site-ul Lecții WordPress gratuite

Exemplul 4: Imaginile ca linkuri.

Imagine exemplu ca referință

Exemplu de link către loc anume Pe pagina

Du-te la text

Textul paginii...

ÎN în acest exemplu pagina este etichetată „listă” folosind atributul „nume”. Conectarea la această etichetă vă va duce la o anumită zonă a paginii.

Descărcați fișierul Scrieți o scrisoare

Puteți seta culoarea link-urilor folosind atributele care sunt specificate în eticheta „body” ca parametri. Luați în considerare aceste atribute:

• link - link nevizitat, implicit este afișat cu albastru;
• alink - link activ, roșu implicit;
• vlink - link vizitat, mov implicit.

Un exemplu de setare a culorii pentru link-uri...

Astfel, ne-am dat seama de principiul prin care sunt create link-urile în HTML. Legăturile pot primi stiluri specifice. Puteți vedea despre asta în lecție accesând linkul.

În acest articol, vă voi spune cum puteți redirecționa un utilizator de la o pagină web la alta folosind JavaScript. O sa dau si cateva exemple simple redirecționare JS.

Puteți redirecționa un utilizator de la o pagină web la oricare alta în mai multe moduri. Inclusiv prin actualizarea metadatelor HTML, redirecționarea pe server. De exemplu, folosind un fișier .htaccess, PHP și redirecționarea clientului prin JavaScript.

Dar rețineți că redirecționările neașteptate care au loc în mijlocul unei alte activități sunt enervante pentru vizitatori. Prin urmare, ar trebui să utilizați o redirecționare numai dacă este cu adevărat necesar și dacă are sens din punctul de vedere al utilizatorului.

Să vedem cum poate fi folosit JavaScript pentru a redirecționa utilizatorul către o altă pagină.

Redirecționare automată JavaScript către o altă pagină

Dacă doriți să redirecționați automat utilizatorul de la o pagină (URL1) la o altă pagină (URL2), puteți utiliza următorul cod:

window.location.href = "URL2";

Trebuie să lipiți codul de mai sus pe prima pagină (URL1). Înlocuiți URL2 cu adresa solicitată pagini. Este mai bine să plasați acest cod în interiorul elementului (mai degrabă decât în ​​partea de jos a paginii), astfel încât pagina să fie redirecționată înainte ca browserul să înceapă să o redeze.

SFAT: Dacă utilizați JavaScript inline (adică fără un fișier .js extern), asigurați-vă că Cod JavaScript la etichete.

Redirecționați către altă pagină după X secunde

În acest exemplu, vom efectua o redirecționare js către o altă pagină la ceva timp după ce pagina s-a încărcat. De exemplu, dacă trebuie să redirecționați un vizitator către pagina principala după ce pagina de bun venit este afișată timp de 5 secunde:

setTimeout(function())( window.location.href = "homepage-url"; ), 5 * 1000);

Trebuie să lipiți următorul cod JavaScript pe pagina de bun venit. Nu uitați să înlocuiți adresa URL a paginii de pornire cu adresa URL a paginii de pornire.

Am folosit metoda setTimeout pentru a spune scriptului să redirecționeze după 5 secunde (înmulțiți 5 cu 1000 pentru a converti secundele în milisecunde).

Sfat: B Semnificații JavaScript timpii sunt întotdeauna calculati în milisecunde.

Redirecționați către o altă pagină în funcție de condiție

De exemplu, puteți redirecționa în funcție de browserul vizitatorului (deși acest lucru nu este recomandat), dimensiunea ecranului, ora din zi sau altă condiție.

Utilizați următorul cod pentru a redirecționa vizitatorii care îndeplinesc o anumită condiție:

dacă (CONDIȚIE) ( window.location.href = "redirect-url"; )

De exemplu, acest cod redirecționează vizitatorii către o altă pagină dacă lățimea ecranului lor este mai mică de 600 de pixeli:

daca (latimea ecranului< 600) { window.location.href = "redirect-url"; }

Redirecționați către o altă pagină pe baza acțiunilor utilizatorului

Ultimul exemplu demonstrează cum să redirecționați un vizitator pe baza acțiunilor sale. Puteți lega o redirecționare js la orice tip de acțiune a utilizatorului. În acest exemplu, pentru simplitate, ne vom ocupa de un clic pe buton.

Următorul cod va redirecționa vizitatorul către pagina de destinație după ce faceți clic pe #mybutton :

document.getElementById("mybutton").onclick = function() ( window.location.href = "redirect-url"; );

Puteți face același lucru folosind următorul cod:

Mergi la pagina principală, mergi la pagina de început

De asemenea, puteți asocia o redirecționare cu orice eveniment sau acțiune a utilizatorului. Nu uitați să vă asigurați că redirecționările nu vor frustra utilizatorii.

Am încercat să iau în considerare totul cazuri posibile js redirecționează către altă pagină. Dacă voi întâlni vreodată alte scenarii, le voi adăuga la acest articol.

Traducerea articolului „Redirecționare către altă pagină cu JavaScript” a fost pregătită de echipa prietenoasă a proiectului.

Rău Bun

În acest articol ne vom uita la diferite căi redirecționare JS. Să explorăm opțiunile de redirecționare alternativă pentru când JavaScript este dezactivat. Și, de asemenea, impactul utilizării...