Başka bir web sayfasına nasıl yönlendirebilirim?


7723

JQuery veya salt JavaScript kullanarak kullanıcıyı bir sayfadan diğerine nasıl yönlendirebilirim?


147
Her iki window.location = url görmeye devam; ve window.location.href = url; Nasıl farklılar? Öyle mi? BTW, window.location.replace (url) hakkında bir şey bilmiyordum. Güzel.
David M. Miller

100
window.locationwindow.location.hrefdavranış açısından aynıdır . window.locationbir nesneyi döndürür. Eğer .hrefayarlanmazsa, window.locationvarsayılan parametreyi değiştirmek için .href. Sonuç: İkisinden birini kullanın.
Raptor

10
var url = "web sitesi adı" $ (konum) .attr ('href', url);
Mad Scientist

31
@MadScientist Bunu yapmanın geriye dönük bir yolu. Konum nesnesi bir HTML öğesi değildir ve ayarlamak için jquery nesnesini kullanmak yanlış görünüyor. Düz JS kodu bu kadar basit olduğunda neden bunu kullanasınız ki?
Juan Mendes

1
Neden yönlendirmek istiyorsunuz? Giriş formu gönderilmemeli mi? Hedef sayfada mantık olmasa bile, formu yine de başka bir sayfaya gönderebileceksiniz.
Dimt

Yanıtlar:


14808

Biri sadece jQuery kullanarak yönlendirme yapmaz

jQuery gerekli değildir ve window.location.replace(...)bir HTTP yönlendirmesini en iyi şekilde taklit eder.

window.location.replace(...)kullanmaktan daha iyidir window.location.href, çünkü replace()başlangıç ​​sayfasını oturum geçmişinde tutmaz, yani kullanıcı hiç bitmeyen bir geri düğmesi fiyaskosına sıkışmaz.

Bir bağlantıyı tıklayarak birini simüle etmek istiyorsanız, location.href

Bir HTTP yönlendirmesini simüle etmek istiyorsanız şunu kullanın: location.replace

Örneğin:

// similar behavior as an HTTP redirect
window.location.replace("http://stackoverflow.com");

// similar behavior as clicking on a link
window.location.href = "http://stackoverflow.com";

// Another method for doing redirecting with JavaScript is this:
window.location = "https://stackoverflow.com";

78
Gönder düğmesi durumunda return return false; ayrıca fonksiyonun içinde
Abhi

134
Soru özellikle javascript ile ilgilidir, ancak kullanıcının javascript devre dışı bırakılmış olması durumunda bir meta yenilemenin geri dönüş olarak kullanılabileceğini belirtmek faydalı olabilir
Hoppe

22
@ NicolòMartini If (IE) document.write ("");
Jeff Noel

48
Zaten jQuery kullanıyorsanız, kullanın $(location).attr('href',url);. window.location.hrefbazı tarayıcılarda tutarsız bir davranışa sahip gibi görünüyor, aslında, Firefox'un sürümünde işe yaramıyor. window.locationDoğrudan IE sürümlerinde çalışma ayarını söylemek duydum .
Noz

8
"daha iyi" kaldırılmalıdır. Cevabın ilerleyen bölümlerinde belirtildiği gibi, en iyi çözüm durumsaldır. OP "Javascript ile bir HTTP yönlendirmesine nasıl öykünebilirim?"
Sorusunu sormaz

1684

UYARI: Bu cevap yalnızca olası bir çözüm olarak verilmiştir; o besbelli değil o jQuery gerektirdiğinden, en iyi çözüm. Bunun yerine, saf JavaScript çözümünü tercih edin.

$(location).attr('href', 'http://stackoverflow.com')

63
Bu sorunun tam cevabı. Zaten Jquery kullanıyorsanız ve bu yüzden zaten yüklü varsa o zaman daha bant genişliği verimli ve tabii ki kısayolu kullanmak daha net olacaktır
barrymac

27
Daha da önemlisi, bunu çıkarılmış olan jQuery ile yapmanın bir yolu var mı? Bu sadece window.location.href = url için bir sarıcıdır; Ancak jQuery'nin bir işlevi varsa, window.location.href = url; mevcut ortamda (tarayıcı, işletim sistemi, vb.) çalışmayacaktı jQuery core telafi edebilir?
Chris

271
JQuery'yi bu şekilde denkleme zorlamak sadece saçma ve anlamsızdır, çünkü özellikle window.locationbir unsur olmadığından ve nitelikleri yoktur.
Tim Down

10
Bir şekilde bu hala .attr()aslında öznitelikleri ayarlar ie ( .setAttribute()
j

156
@deltaray Bu, yöneltmenin başka bir yolu değil , yukarıda da belirtildiği gibi, konum nesnesinin etrafında anlamsız bir sarıcı, ki bu bile bir öğe değil! Bu bana i.stack.imgur.com/ssRUr.gif
JCM

676

Bir sayfayı yeniden yönlendirmenin standart "vanilya" JavaScript yolu

window.location.href = 'newPage.html';

Veya daha basit: ( windowGlobal olduğu için)

location.href = 'newPage.html';

Yeniden yönlendirirken HTTP_REFERER kaybettiğiniz için buradaysanız , okumaya devam edin:

(Aksi takdirde bu son bölümü yoksay)


Aşağıdaki bölüm HTTP_REFERERbirçok güvenlik önleminden biri olarak kullananlar içindir (büyük bir koruyucu önlem olmamasına rağmen). Internet Explorer 8 veya daha düşük bir sürümünü kullanıyorsanız , JavaScript sayfa yeniden yönlendirmesinin herhangi bir biçimini (location.href vb.) Kullanırken bu değişkenler kaybolur.

Aşağıda HTTP_REFERER'ı kaybetmemek için IE8 ve daha düşük bir alternatif uygulayacağız . Aksi takdirde, neredeyse her zaman kullanabilirsiniz window.location.href.

Buna karşı test HTTP_REFERER(URL yapıştırma, oturum vb.) , Bir isteğin meşru olup olmadığını anlamaya yardımcı olabilir . ( Not: yorumlarda sarkma bağlantısının belirttiği gibi, bu yönlendirmeleri geçici olarak bulmanın / taklit etmenin yolları da vardır)


Basit çapraz tarayıcı test çözümü (Internet Explorer 9+ ve diğer tüm tarayıcılar için window.location.href dosyasına geri dönüş)

Kullanımı: redirect('anotherpage.aspx');

function redirect (url) {
    var ua        = navigator.userAgent.toLowerCase(),
        isIE      = ua.indexOf('msie') !== -1,
        version   = parseInt(ua.substr(4, 2), 10);

    // Internet Explorer 8 and lower
    if (isIE && version < 9) {
        var link = document.createElement('a');
        link.href = url;
        document.body.appendChild(link);
        link.click();
    }

    // All other browsers can use the standard window.location.href (they don't lose HTTP_REFERER like Internet Explorer 8 & lower does)
    else { 
        window.location.href = url; 
    }
}

60
Dipnot: bir güvenlik önlemi olarak yönlendireni kontrol etmek berbat bir çözümdür. duckduckgo.com/?q=referrer+spoofing
droope

Yönlendiren URL'de bir HTTP GET oturum kimliğiniz varsa, oturumun geçerliliğini kontrol etmek için kullanılabilir.
Andrew Fox

@mcpDESIGNS kullanmaya çalıştığınızdan emin misiniz location.assign? IE8 ile uygulamamda kullanıyorum ve HTTP_REFERERbaşlığı kaybetmiyorum .
Buzinas

En azından 2012'de işe yaramadı, belki daha sonra IE8 yamaları düzeltti - bu duymak güzel!
Mark Pieszak - Trilon.io

1
HTTP_REFERER ile ilgili sözünüz bana window.open ile yaşadığım sorunu anlamama yardımcı oldu ve burada bir çözüm buldum: stackoverflow.com/questions/7580613/… . Bu arada IE11'de sorun yaşıyorum!
Dov Miller

427

Bunu yapmanın birçok yolu var.

// window.location
window.location.replace('http://www.example.com')
window.location.assign('http://www.example.com')
window.location.href = 'http://www.example.com'
document.location.href = '/path'

// window.history
window.history.back()
window.history.go(-1)

// window.navigate; ONLY for old versions of Internet Explorer
window.navigate('top.jsp')


// Probably no bueno
self.location = 'http://www.example.com';
top.location = 'http://www.example.com';

// jQuery
$(location).attr('href','http://www.example.com')
$(window).attr('location','http://www.example.com')
$(location).prop('href', 'http://www.example.com')

8
window.navigateyalnızca eski IE'dir (Firefox / Chrome bunu desteklemez). Tüm seçenekleri numaralandırmak istiyorsanız, unutmayın document.location.
Rob W

document.location = document.referrer; Lütfen listeye de ekleyin. Bu, History.back gibi çalışmaz, sayfayı tekrar Yenile yapar.
Ali Humayun

.attr () jQuery 3.0.0 üzerinde çalışmaz. yerine .val () kullanın.
Rivalus

4
@ LéoLam Bu yüzden Google adında bir arama motoru var. :-) Google'da her birini arayabilir ve farkı bulabilirsiniz. Rastgele birini seçmek istemezsin.
Ben En Aptal


330

Bu her tarayıcı için geçerlidir:

window.location.href = 'your_url';

8
document.location.replace(redirectURL)İlk sayfanın tarayıcı geçmişinde olmasını istemiyorsanız da yapabilirsiniz
jazzcat

298

Yapmaya çalıştığınız şeyde biraz daha açıklayıcı olmanız yardımcı olacaktır. Disk belleği olan verileri oluşturmaya çalışıyorsanız, bunu nasıl yapacağınız konusunda bazı seçenekler vardır. Doğrudan ulaşmak istediğiniz her sayfa için ayrı bağlantılar oluşturabilirsiniz.

<a href='/path-to-page?page=1' class='pager-link'>1</a>
<a href='/path-to-page?page=2' class='pager-link'>2</a>
<span class='pager-link current-page'>3</a>
...

Örnekteki geçerli sayfanın kodda ve CSS ile farklı işlendiğini unutmayın.

Disk belleği verilerinin AJAX aracılığıyla değiştirilmesini istiyorsanız, jQuery devreye girecektir. Yapacağınız şey, farklı bir sayfaya karşılık gelen bağlantı etiketlerinin her birine bir tıklama işleyicisi eklemektir. Bu tıklama işleyici, AJAX aracılığıyla bir sonraki sayfayı alıp tabloyu yeni verilerle güncelleyen bazı jQuery kodunu çağırır. Aşağıdaki örnekte, yeni sayfa verilerini döndüren bir web hizmetiniz olduğu varsayılmaktadır.

$(document).ready( function() {
    $('a.pager-link').click( function() {
        var page = $(this).attr('href').split(/\?/)[1];
        $.ajax({
            type: 'POST',
            url: '/path-to-service',
            data: page,
            success: function(content) {
               $('#myTable').html(content);  // replace
            }
        });
        return false; // to stop link
    });
});

252

Ben de bunun location.replace(URL)en iyi yol olduğunu düşünüyorum , ancak arama motorlarını yönlendirmeniz hakkında bilgilendirmek istiyorsanız (yönlendirmeyi görmek için JavaScript kodunu analiz etmezler) rel="canonical"meta etiketi web sitenize eklemelisiniz .

İçinde HTML yenileme meta etiketi bulunan bir noscript bölümü eklemek de iyi bir çözümdür. Yeniden yönlendirmeler oluşturmak için bu JavaScript yeniden yönlendirme aracını kullanmanızı öneririm . HTTP yönlendiricisini iletmek için Internet Explorer desteği de vardır.

Gecikmesiz örnek kod şöyle görünür:

<!-- Place this snippet right after opening the head tag to make it work properly -->

<!-- This code is licensed under GNU GPL v3 -->
<!-- You are allowed to freely copy, distribute and use this code, but removing author credit is strictly prohibited -->
<!-- Generated by http://insider.zone/tools/client-side-url-redirect-generator/ -->

<!-- REDIRECTING STARTS -->
<link rel="canonical" href="https://yourdomain.com/"/>
<noscript>
    <meta http-equiv="refresh" content="0;URL=https://yourdomain.com/">
</noscript>
<!--[if lt IE 9]><script type="text/javascript">var IE_fix=true;</script><![endif]-->
<script type="text/javascript">
    var url = "https://yourdomain.com/";
    if(typeof IE_fix != "undefined") // IE8 and lower fix to pass the http referer
    {
        document.write("redirecting..."); // Don't remove this line or appendChild() will fail because it is called before document.onload to make the redirect as fast as possible. Nobody will see this text, it is only a tech fix.
        var referLink = document.createElement("a");
        referLink.href = url;
        document.body.appendChild(referLink);
        referLink.click();
    }
    else { window.location.replace(url); } // All other browsers
</script>
<!-- Credit goes to http://insider.zone/ -->
<!-- REDIRECTING ENDS -->

228

Birisi ana sayfaya geri yönlendirmek istiyorsa, aşağıdaki snippet'i kullanabilir.

window.location = window.location.host

Geliştirme, evreleme ve üretim olarak üç farklı ortamınız olması faydalı olacaktır.

Bu kelimeleri yalnızca Chrome Konsolu'na veya Firebug'un Konsoluna koyarak bu pencere veya window.location nesnesini keşfedebilirsiniz .


window.location.replace (window.location.protocol + "//" + window.location.host)
moala

13
daha da basit: window.location = '/'
Iftah

213

JavaScript, tarayıcının adres çubuğunda görüntülenen geçerli URL'yi almak ve değiştirmek için birçok yöntem sunar. Tüm bu yöntemler, Window nesnesinin bir özelliği olan Location nesnesini kullanır. Aşağıdaki gibi geçerli URL'ye sahip yeni bir Konum nesnesi oluşturabilirsiniz.

var currentLocation = window.location;

Bir URL'nin Temel Yapısı

<protocol>//<hostname>:<port>/<pathname><search><hash>

resim açıklamasını buraya girin

  1. Protokol - İnternette kaynağa erişmek için kullanılacak protokol adını belirtir. (HTTP (SSL olmadan) veya HTTPS (SSL ile))

  2. hostname - Ana bilgisayar adı, kaynağın sahibi olan ana bilgisayarı belirtir. Örneğin, www.stackoverflow.com. Bir sunucu, ana bilgisayarın adını kullanarak hizmetler sağlar.

  3. port - İnternet veya başka bir şebeke mesajının bir sunucuya ulaştığında iletileceği belirli bir işlemi tanımak için kullanılan bir port numarası.

  4. pathname - Yol, ana istemcideki Web istemcisinin erişmek istediği kaynak hakkında bilgi verir. Örneğin, stackoverflow.com/index.html.

  5. query - Bir sorgu dizesi, yol bileşenini izler ve kaynağın bir amaçla kullanabileceği bir bilgi dizesi sağlar (örneğin, bir arama için parametreler veya işlenecek veriler olarak).

  6. hash - Bir URL'nin bağlantı kısmı, karma işaretini (#) içerir.

Bu Konum nesnesi özellikleriyle bu URL bileşenlerinin tümüne erişebilirsiniz

  1. hash -Bir URL'nin bağlantı bölümünü ayarlar veya döndürür.
  2. host - Bir URL'nin ana bilgisayar adını ve bağlantı noktasını ayarlar veya döndürür.
  3. hostname - Bir URL'nin ana bilgisayar adını ayarlar veya döndürür.
  4. href- URL'nin tamamını ayarlar veya döndürür.
  5. pathname - Bir URL'nin yol adını ayarlar veya döndürür.
  6. port - Sunucunun bir URL için kullandığı port numarasını ayarlar veya döndürür.
  7. protokol -Bir URL'nin protokolünü ayarlar veya döndürür.
  8. arama -Bir URL'nin sorgu bölümünü ayarlar veya döndürür

Şimdi Bir sayfayı değiştirmek veya kullanıcıyı başka bir sayfaya yönlendirmek istiyorsanız href, Location nesnesinin özelliğini şöyle kullanabilirsiniz

Location nesnesinin href özelliğini kullanabilirsiniz.

window.location.href = "http://www.stackoverflow.com";

Konum Nesnesi de bu üç yönteme sahiptir

  1. assign () - Yeni bir belge yükler.
  2. reload () - Geçerli belgeyi yeniden yükler.
  3. replace () - Geçerli belgeyi yenisiyle değiştirir

Bunun gibi diğer sayfalara yönlendirmek için ata () ve yöntemlerini de kullanabilirsiniz.

location.assign("http://www.stackoverflow.com");

location.replace("http://www.stackoverflow.com");

Assign () ve replace () nasıl farklılık gösterir - replace () yöntemi ile assign () yöntemi () arasındaki fark, replace () öğesinin geçerli belgenin URL'sini belge geçmişinden kaldırmasıdır, bunun kullanılması mümkün olmadığı anlamına gelir orijinal belgeye geri dönmek için "geri" düğmesine basın. Bu nedenle, yeni bir belge yüklemek istiyorsanız, orijinal belgeye geri dönme seçeneği vermek istiyorsanız assign () yöntemini kullanın.

Sen kullanarak konum nesne href özelliğini değiştirebilir jQuery böyle de

$(location).attr('href',url);

Ve böylece kullanıcıyı başka bir URL'ye yönlendirebilirsiniz.


203

Temelde jQuery sadece bir JavaScript çerçevesidir ve bu durumda yeniden yönlendirme gibi bazı şeyleri yapmak için sadece saf JavaScript kullanabilirsiniz, bu durumda vanilya JavaScript'i kullanarak 3 seçeneğiniz vardır:

1) Konum değiştirmeyi kullanarak , sayfanın geçerli geçmişinin yerini alacaktır , orijinal sayfaya geri dönmek için geri düğmesini kullanmanın mümkün olmadığı anlamına gelir .

window.location.replace("http://stackoverflow.com");

2) Konum atamayı kullanarak , bu sizin için geçmişi tutacak ve geri düğmesini kullanarak orijinal sayfaya geri dönebilirsiniz:

window.location.assign("http://stackoverflow.com");

3) Önceki yöntemlerden birini kullanmanızı öneririm, ancak bu saf JavaScript kullanan üçüncü seçenek olabilir:

window.location.href="http://stackoverflow.com";

Sadece bir satır saf JavaScript işlevi var olarak Ayrıca pencere kapsamı içindeyseniz örnek için ayrıca, penceresiz fonksiyonların Yukarıdakilerin hepsi kullanabilirsiniz, bunu işlemek için jQuery bir işlev yazmak, ancak tavsiye edemez window.location.replace("http://stackoverflow.com");olabilirlocation.replace("http://stackoverflow.com");

Ayrıca hepsini aşağıdaki resimde göstereceğim:

location.replace location.assign


1
Ben kullanmanızı tavsiye assign()üzerine href=çok ikincisi bazı durumlarda benim için düzgün çalışmadı olarak.
marsze


169

Başlamadan önce jQuery, DOM manipülasyonu için kullanılan bir JavaScript kütüphanesidir. Bu nedenle, sayfa yönlendirmesi için jQuery kullanmamalısınız.

Jquery.com'dan bir teklif:

JQuery, eski tarayıcı sürümlerinde önemli sorunlar olmadan çalışabilse de, jQuery'yi aktif olarak test etmiyoruz ve genellikle içinde görünebilecek hataları düzeltmiyoruz.

Burada bulundu: https://jquery.com/browser-support/

Dolayısıyla jQuery geriye dönük uyumluluk için bir son ve hepsi bir çözüm değildir.

Ham JavaScript kullanan aşağıdaki çözüm tüm tarayıcılarda çalışır ve uzun süredir standarttır, bu nedenle çapraz tarayıcı desteği için herhangi bir kütüphaneye ihtiyacınız yoktur.

Bu sayfa 3000 milisaniyeden sonra Google'a yönlendirilecek

<!DOCTYPE html>
<html>
    <head>
        <title>example</title>
    </head>
    <body>
        <p>You will be redirected to google shortly.</p>
        <script>
            setTimeout(function(){
                window.location.href="http://www.google.com"; // The URL that will be redirected too.
            }, 3000); // The bigger the number the longer the delay.
        </script>
    </body>
</html>

Farklı seçenekler aşağıdaki gibidir:

window.location.href="url"; // Simulates normal navigation to a new page
window.location.replace("url"); // Removes current URL from history and replaces it with a new URL
window.location.assign("url"); // Adds new URL to the history stack and redirects to the new URL

window.history.back(); // Simulates a back button click
window.history.go(-1); // Simulates a back button click
window.history.back(-1); // Simulates a back button click
window.navigate("page.html"); // Same as window.location="url"

Değiştir'i kullanırken, geri düğmesi, hiç geçmişte olmamış gibi yönlendirme sayfasına geri dönmeyecektir. Kullanıcının yönlendirme sayfasına geri dönmesini istiyorsanız window.location.hrefveya düğmesini kullanın window.location.assign. Kullanıcının yönlendirme sayfasına geri dönmesini sağlayan bir seçenek kullanırsanız, yönlendirme sayfasına girdiğinizde bunun sizi yeniden yönlendireceğini unutmayın. Yönlendirmeniz için bir seçenek belirlerken bunu göz önünde bulundurun. Sayfanın yalnızca kullanıcı tarafından bir işlem yapıldığında yeniden yönlendirildiği koşullar altında, sayfanın geri düğmesi geçmişinde bulunması iyi olur. Ancak sayfa otomatik yönlendirmeler yapıyorsa, kullanıcının yönlendirmeyi gönderdiği sayfaya geri dönmeye zorlamadan geri düğmesini kullanabilmesi için replace komutunu kullanmalısınız.

Meta verileri aşağıdaki gibi bir sayfa yönlendirmesi çalıştırmak için de kullanabilirsiniz.

META Yenileme

<meta http-equiv="refresh" content="0;url=http://evil.com/" />

META Bölgesi

<meta http-equiv="location" content="URL=http://evil.com" />

TABAN Ele Geçirme

<base href="http://evil.com/" />

Şüphesiz istemcinizi gitmek istemeyecekleri bir sayfaya yönlendirmek için daha birçok yöntem bu sayfada bulunabilir (bunlardan biri jQuery'ye bağlı değildir):

https://code.google.com/p/html5security/wiki/RedirectionMethods

Ayrıca belirtmek isterim ki insanlar rastgele yönlendirilmek istemiyorlar. İnsanları yalnızca kesinlikle gerektiğinde yönlendirin. İnsanları rastgele yönlendirmeye başlarsanız bir daha asla sitenize gitmezler.

Sonraki paragraf varsayımsaldır:

Ayrıca kötü amaçlı bir site olarak bildirilebilir. Bu durumda, kullanıcılar sitenizin bağlantısını tıkladığında, kullanıcılar tarayıcısı sitenizin kötü amaçlı olduğu konusunda onları uyarabilir. Ne olabilir, insanlar sitenizde kötü bir deneyim bildiriyorsa arama motorları puanınızı düşürmeye başlayabilir.

Lütfen yönlendirmelerle ilgili Google Web Yöneticisi Yönergeleri'ni inceleyin: https://support.google.com/webmasters/answer/2721217?hl=tr&ref_topic=6001971

İşte sizi sayfadan çıkaran eğlenceli küçük bir sayfa.

<!DOCTYPE html>
<html>
    <head>
        <title>Go Away</title>
    </head>
    <body>
        <h1>Go Away</h1>
        <script>
            setTimeout(function(){
                window.history.back();
            }, 3000);
        </script>
    </body>
</html>

İki sayfa örneğini bir araya getirirseniz, kullanıcılarınızın sitenizi bir daha asla kullanmak istemeyeceğini garanti edecek bir yeniden yönlendirme döngüsüne sahip olursunuz.


5
Gerekli olmadığını söyleyerek jQuery için yaptığı talebi ele alıyorum. JQuery'nin JavaScript için birçok yararlı kısayolu vardır, ancak yönlendirmeler için herhangi bir kısayola gerek yoktur. JQuery sadece JavaScript'tir. Başka bir şey yok. Bir yönlendirmeyi çağırmanın normal yolu, jQuery kullanarak işlevleriyle çalışacaktır.
Patrick W. McMahon

165
var url = 'asdf.html';
window.location.href = url;

145

Bunu jQuery olmadan yapabilirsiniz:

window.location = "http://yourdomain.com";

Ve sadece jQuery istiyorsanız o zaman bunu yapabilirsiniz:

$jq(window).attr("location","http://yourdomain.com");

JQuery, gelecekteki tarayıcı değişikliklerini / kullanım dışı
bırakmaları soyutlayabileceği

@Epirocks jQuery'de bunun için tasarlanmış bir API varsa, bu geçerli bir neden olabilir (bu API'nın değişeceğinden şüphelenir), ancak buradaki örnek, jQuery'nin DOM dışı nesneleri sartabileceğiniz ve bazı yöntemler çalışmaya devam edecektir.
1j01

'Bazı yöntemlerin hala işe yarayacağı' gerçeği, soyutlayarak kastettiğim şeydir. Evet, bunu JQuery olmadan yapabilirsiniz, ancak JQuery olmadan her şeyi yapabilirsiniz.
Epirocks

144

Bu jQuery ile çalışır:

$(window).attr("location", "http://google.fr");

Sadece işe yaradığı için yapmanız gerektiği anlamına gelmez. Bu ayar etrafında anlamsız bir window.location
dolaylama

89

# JQuery / JavaScript Kullanarak HTML Sayfa Yönlendirme

Bu örnek kodu deneyin:

function YourJavaScriptFunction()
{
    var i = $('#login').val();
    if (i == 'login')
        window.location = "login.php";
    else
        window.location = "Logout.php";
}

Olarak tam bir URL vermek istiyorsanız window.location = "www.google.co.in";.


"JQuery kullanmak" um, yanlış. Tam bir URL kullanma örneği, tam bir URL olmadığı için çalışmaz. Protokol yok, bu nedenle göreli URL olarak yorumlanacak.
1j01

80

Bu satırı kodunuza koymanız gerekir:

$(location).attr("href","http://stackoverflow.com");

JQuery'niz yoksa, JavaScript ile devam edin:

window.location.replace("http://stackoverflow.com");
window.location.href("http://stackoverflow.com");

80

Orijinal soru: "jQuery kullanarak nasıl yönlendirilir?", Bu nedenle cevap jQuery >> Ücretsiz kullanım örneği uygular.


Yalnızca JavaScript içeren bir sayfaya yönlendirmek için:

window.location.href = "/contact/";

Veya bir gecikmeye ihtiyacınız varsa:

setTimeout(function () {
  window.location.href = "/contact/";
}, 2000);   // Time in milliseconds

jQuery, bir web sayfasındaki öğeleri kolaylıkla seçmenizi sağlar. Bir sayfada istediğiniz her şeyi bulabilir ve daha sonra özel efektler eklemek, kullanıcı işlemlerine tepki vermek veya seçtiğiniz öğenin içinde veya dışında içerik göstermek ve gizlemek için jQuery'yi kullanabilirsiniz. Tüm bu görevler, bir öğenin veya etkinliğin nasıl seçileceğini bilmekle başlar .

$('a,img').on('click',function(e){
  e.preventDefault();
  $(this).animate({
    opacity: 0 //Put some CSS animation here
  }, 500);
  setTimeout(function(){
    // OK, finished jQuery staff, let's go redirect
    window.location.href = "/contact/";
  },500);
});

Birisinin 10000 satır kod içeren bir komut dosyası / eklenti yazdığını düşünün. JQuery ile bu koda sadece bir veya iki satırla bağlanabilirsiniz.


Javascript header: Bunun yerine zamanı saniye cinsinden yapmak mümkün mü?
PythonMaster202

79

Peki, soru bir web sitesine nasıl yönlendirileceği değil, nasıl bir yönlendirme sayfası oluşturulacağıdır.

Bunun için yalnızca JavaScript kullanmanız gerekir. İşte dinamik bir yönlendirme sayfası oluşturacak bazı küçük kodlar.

<script>
    var url = window.location.search.split('url=')[1]; // Get the URL after ?url=
    if( url ) window.location.replace(url);
</script>

Bu snippet'i redirect/index.htmlweb sitenizdeki bir dosyaya koyduğunuzu varsayalım .

http://www.mywebsite.com/redirect?url=http://stackoverflow.com

Ve bu bağlantıya giderseniz sizi otomatik olarak stackoverflow.com adresine yönlendirecektir .

Belgelere Bağlantı

Ve bu bir hale nasıl Basit JavaScript yönlendirme sayfasını

Düzenle:

Dikkat edilmesi gereken bir şey daha var. Eklediğim window.location.replacebunu bir yönlendirme sayfasını yakıştığını düşünüyorum çünkü benim kodunda, ancak, kullandığınız zaman bilmelisiniz window.location.replaceve bunu olacaktır tarayıcınızda geri düğmesine bastığınızda, yönlendirildi değil yönlendirme sayfaya geri var ve olacak önceki sayfaya geri dönün, bu küçük demo şeye bir göz atın.

Misal:

İşlem: store home => sayfayı google => google'a yönlendir

Google'dayken: google => tarayıcıdaki geri düğmesi => mağaza ana sayfası

Yani, bu sizin ihtiyaçlarınıza uygunsa, o zaman her şey iyi olmalıdır. Yönlendirme sayfasını tarayıcı geçmişine dahil etmek istiyorsanız bunu değiştirin

if( url ) window.location.replace(url);

ile

if( url ) window.location.href = url;

74

Tıklama işlevinize şunu ekleyin:

window.location.href = "The URL where you want to redirect";
$('#id').click(function(){
    window.location.href = "http://www.google.com";
});


57

jQuery gerekli değildir. Bunu yapabilirsiniz:

window.open("URL","_self","","")

Bu kadar kolay!

HTTP isteği başlatmanın en iyi yolu document.loacation.href.replace('URL').


52

Önce düzgün yazın. Başka bir bağlantı için uygulamanızdan başka bir bağlantı için bir uygulama içinde gezinmek istiyorsunuz. İşte kod:

window.location.href = "http://www.google.com";

Uygulamanızdaki sayfalarda gezinmek istiyorsanız, o zaman da kodum var.


52

JQuery'de şu şekilde yönlendirebilirsiniz:

$(location).attr('href', 'http://yourPage.com/');

45

JavaScript ve jQuery'de, bir sayfayı başka bir sayfaya yönlendirmek için aşağıdaki kodu kullanabiliriz:

window.location.href="http://google.com";
window.location.replace("page1.html");

45

ECMAScript 6 + jQuery, 85 bayt

$({jQueryCode:(url)=>location.replace(url)}).attr("jQueryCode")("http://example.com")

Lütfen beni öldürme, bu bir şaka. Bu bir şaka. Bu bir şaka.

Bu, "jQuery kullanarak" bir çözüm istemesi anlamında "bu soruya bir cevap vermiştir" ki bu durumda bir şekilde denkleme zorlamak gerekir.

Ferrybig görünüşe göre açıklanan şaka ihtiyacı (hala şaka, inceleme formunda sınırlı seçenekler olduğundan eminim), bu yüzden daha fazla uzatmadan:

Diğer cevaplar gereksiz yere veya nesneler attr()üzerinde jQuery's kullanıyor .locationwindow

Bu cevap da onu kötüye kullanıyor, ama daha saçma bir şekilde. Konumu ayarlamak için kullanmak yerine,attr() bir işlevi almak için kullanılır.

İşlev, jQueryCodejQuery hakkında hiçbir şey olmamasına rağmen adlandırılmıştır ve bir işlevi çağırmak somethingCode, özellikle de bir şey bile bir dil olmadığında, sadece korkunçtur.

"85 bayt" Code Golf için bir referanstır. Golf tabii ki kod golf dışında yapmanız gereken bir şey değildir ve ayrıca bu cevap açıkça golf değil.

Temel olarak, kısmak.


45

JavaScript:

window.location.href='www.your_url.com';
window.top.location.href='www.your_url.com';
window.location.replace('www.your_url.com');

jQuery:

var url='www.your_url.com';
$(location).attr('href',url);
$(location).prop('href',url);//instead of location you can use window

1
URL'yi jQuery'de değişken olarak saklamanın bir nedeni var, ancak Vanilya ile değil mi?
ESR

43

JavaScript kullanma:

Yöntem 1:

window.location.href="http://google.com";

Yöntem 2:

window.location.replace("http://google.com");

JQuery kullanma:

Yöntem 1: $ (konum)

$(location).attr('href', 'http://google.com');

Yöntem 2: Yeniden Kullanılabilir İşlev

jQuery.fn.redirectTo = function(url){
    window.location.href = url;
}

jQuery(window).redirectTo("http://google.com");

41

İşte bir zaman gecikmesi yönlendirmesi. Gecikme süresini istediğiniz gibi ayarlayabilirsiniz:

<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Your Document Title</title>
    <script type="text/javascript">
        function delayer(delay) {
            onLoad = setTimeout('window.location.href = "http://www.google.com/"', delay);
        }
    </script>
</head>

<body>
    <script>
        delayer(8000)
    </script>
    <div>You will be redirected in 8 seconds!</div>
</body>

</html>

5
daha iyisini yapın: setTimeout (function () {window.location.href = " google.com "}, delay);
dikkini

39

Bunu yapmanın üç ana yolu vardır,

window.location.href='blaah.com';
window.location.assign('blaah.com');

ve...

window.location.replace('blaah.com');

Sonuncusu, geleneksel bir yönlendirme için en iyisidir, çünkü arama geçmişinize yönlendirilmeden önce gittiğiniz sayfayı kaydetmez. Ancak, JavaScript ile bir sekme açmak istiyorsanız, yukarıdakilerden herhangi birini kullanabilirsiniz. 1

EDIT: windowÖnek isteğe bağlıdır.

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.