Prečest problem s kojim se susreću web programeri uključuje kreiranje preusmjeravanja na drugu web stranicu pritiskom na dugme. To nije samo jednostavan zadatak već i ključan u poboljšanju upotrebljivosti i navigacije vaše stranice. Često koristimo preusmjeravanje, bilo za jednostavne stvari kao što je odvođenje korisnika na drugu stranicu nakon uspješne prijave na nešto složenije kao što je praćenje ponašanja klikova i prilagođavanje web okruženja.
Usmjeravanje koraka ka rješenju
Rješenje ovog uobičajenog problema može se postići sa lakoćom korištenjem JavaScripta. Sa jednostavnim blokom koda koji se pokreće tokom klika na dugme, web stranica može glatko preusmjeriti na drugu web stranicu ili stranicu.
U JavaScriptu postoje dvije glavne metode koje možete koristiti za našu svrhu: `location.href` i `location.replace()` koje pripadaju objektu window.location.
- 'location.href' je možda najjednostavniji i najlakši način za preusmjeravanje na novi URL.
- 'location.replace()' se koristi kada želite zamijeniti trenutnu povijest stranice novom preusmjerenom stranicom.
// Using location.href
document.getElementById("myBtn").onclick = function () {
location.href = "https://www.newurl.com";
};
// Using location.replace()
document.getElementById("myBtn").onclick = function () {
location.replace("https://www.newurl.com");
};
Korak po korak objašnjenje koda
Sada, hajde da razložimo kod kako bismo u potpunosti razumjeli njegov radni tok. Na početku, koristimo funkciju `document.getElementById(“myBtn”)` da pristupimo našem dugmetu uz pomoć njegovog jedinstvenog ID-a. `onclick` je JavaScript događaj koji će se pokrenuti kada se klikne na dugme.
Za location.href:
U primjeru, postavljamo `location.href` na novi URL. Ovo svojstvo sadrži trenutni URL web stranice. Dakle, kada ga postavimo na novi URL, pretraživač se prirodno kreće tamo.
Za location.replace():
Funkcija `location.replace()` je prilično slična. Ako ga koristite, trenutni unos historije će biti zamijenjen navedenim URL-om.
Osnovne biblioteke i funkcije
U JavaScript-u, objekat odgovoran za nadgledanje preusmjeravanja web stranice je objekt `window.location`. Predstavlja lokaciju (URL) objekta na koji je povezan. Iz ovog objekta guramo u igru funkcije `location.href` i `location.replace()`.
JavaScript događaji, kao što je `onclick`, takođe igraju vitalnu ulogu u preusmjeravanju gumba. `onclick`, koji se koristi u našim primjerima, će se pokrenuti kada se klikne na dugme. Drugi događaji poput `onmouseover` ili `onload` imaju različite okidače i stoga različite upotrebe, ali `onclick` odgovara našoj svrsi u ovoj situaciji.
Dakle, to je to: jednostavna, ali važna karakteristika web razvoja. Sve je u tome da korisnikovo putovanje kroz vašu web lokaciju učinite što lakšim, što u konačnici može poboljšati stope angažmana i zadržavanja.
