Bagaimana cara mengubah URL saat ini?

100

Saya memiliki kode berikut yang mengubah halaman dari dalam JavaScript:

var newUrl = [some code to build up URL string];
window.location.replace(newUrl);

Tetapi itu tidak mengubah URL teratas, jadi ketika seseorang mengklik tombol kembali itu tidak kembali ke halaman sebelumnya.

Bagaimana saya bisa meminta JavaScript mengubah URL teratas juga sehingga tombol kembali browser berfungsi.

javascript leora
sumber

Jawaban:

38

Penetapan sederhana window.locationatau window.location.hrefseharusnya bagus:

window.location = newUrl;

Namun, URL baru Anda akan menyebabkan browser memuat halaman baru, tetapi sepertinya Anda ingin mengubah URL tanpa meninggalkan halaman saat ini. Anda memiliki dua opsi untuk ini:

  1. Gunakan hash URL. Misalnya, Anda dapat beralih dari example.comke example.com#footanpa memuat halaman baru. Anda dapat mengatur window.location.hashagar ini mudah. Kemudian, Anda harus mendengarkan hashchangeacara HTML5 , yang akan dijalankan saat pengguna menekan tombol kembali. Ini tidak didukung di versi IE yang lebih lama, tetapi lihat jQuery BBQ , yang membuat ini berfungsi di semua browser.

  2. Anda dapat menggunakan Riwayat HTML5 untuk mengubah jalur tanpa memuat ulang halaman. Ini akan memungkinkan Anda untuk mengubah dari example.com/foomenjadi example.com/bar. Menggunakan ini mudah:

    window.history.pushState("example.com/foo");

    Saat pengguna menekan "kembali", Anda akan menerima acara jendela popstate, yang dapat Anda dengarkan dengan mudah (jQuery):

    $(window).bind("popstate", function(e) { alert("location changed"); });

    Sayangnya, ini hanya didukung di browser yang sangat modern, seperti Chrome, Safari, dan Firefox 4 beta.

bcherry.dll
sumber
metode .replace pada string tidak akan mengubah string yang diterapkan, itu akan menghasilkan string baru. " - window.location.replace()metode ini tidak sama dengan String.prototype.replace()metode karena window.locationbukan string (ini objek). window.location.replace()menggantikan arus URL dengan yang baru, sementara menimpa entri URL lama dalam sejarah.
Andy E
1
Terima kasih atas koreksinya, saya akan memperbarui jawaban saya.
bcherry
2
Melihat ke belakang, sejauh ini ini adalah jawaban terbaik. document.location.href tidak memiliki apa pun di pushState
buley
7

Hmm, saya akan menggunakan

window.location = 'http://localhost/index.html#?options=go_here';

Saya tidak begitu yakin apakah itu yang Anda maksud.

Blender
sumber
7

Jika Anda hanya ingin memperbarui jalur relatif Anda juga dapat melakukannya

window.location.pathname = '/relative-link'

"http://domain.com" -> "http://domain.com/relative-link"

Artokun
sumber
0 
<script> 
    var url= "http://www.google.com"; 
    window.location = url; 
</script>
pengguna3230794
sumber