2009-08-20 15 views
5

Ho una serie di collegamenti con #anchors che puntano a una singola pagina Web e vorrei spostarmi senza problemi su un modello con una pagina Web separata per ciascuno di questi collegamenti. Voglio che i vecchi link continuino a funzionare usando un reindirizzamento.Javascript per reindirizzare da #anchor a una pagina separata

vecchio collegamento di stile:

/all_products#A 
/all_products#B 
/all_products#C 

Nuovo stile link:

/products/A 
/products/B 
/products/C 

so che il server non riceve il nome #anchor nella richiesta, ma Javascript forza.

E 'possibile reindirizzare automaticamente da/all_products # A a/products/A utilizzando Javascript?

JQuery andrebbe bene, è comunque utilizzato sul sito.

risposta

1

spero questo può aiutare :)

var urlSplit = document.URL.split("#"); 
if (urlSplit[1]) { 
    location.href = "http://www.example.org" + "/" + urlSplit[1]; 
} 
else { 
    location.href = "http://www.example.org"; 
} 
+0

Nota: c'è un problema con l'utilizzo di questo all'interno di una pagina "predefinita" in una directory per ie8: perde il valore hash. – Gregory

+0

Si dovrebbe preferire [questo metodo per estrarre l'hash] (http://stackoverflow.com/a/10076097/151365) e [questo metodo per reindirizzare] (http://stackoverflow.com/a/506004/151365) a evitare i problemi indicati negli articoli collegati.Ho aggiunto [una risposta aggiornata con le seguenti best practice] (http://stackoverflow.com/a/21198129/151365). – logan

0

questo potrebbe aiutare:

<a href="/all_products#A" onclick="return redirectMe(this);">A</a> 
<a href="/all_products#B" onclick="return redirectMe(this);">B</a> 
<a href="/all_products#C" onclick="return redirectMe(this);">C</a> 
<a href="/all_products#D" onclick="return redirectMe(this);">D</a> 
<a href="/all_products#E" onclick="return redirectMe(this);">E</a> 

<script type="text/javascript"> 
function redirectMe(a){ 
    var aa=a+""; 
    window.location=aa.replace(/#/g,"/"); 
} 
</script> 
+0

voto negativo e nessun commento? – TheVillageIdiot

+0

Downvote non era da me ma questo non è quello che mi serve. Come risposta di kkyy, questo funzionerebbe solo per i collegamenti sul mio sito Web, che posso modificare nel nuovo schema ogni volta che voglio. Devo reindirizzare i collegamenti salvati su altri siti Web sui quali non ho il controllo. –

1

con jQuery, né basta sostituire il href con quello corretto:

$('a').each(function() { 
    this.href = this.href.replace(/all_products#/, 'products/'); 
}); 

o catturare scatti e reindirizzare:

$('a').click(function() { 
    window.location = this.href.replace(/all_products#/, 'products/'); 
    return false; 
}); 
+1

Ma questo funzionerebbe solo per i collegamenti sul mio sito. Non per collegamenti esistenti da altri siti. Destra? –

2

mettere questo il più vicino alla parte superiore del codice HTML <head> possibile in modo che può eseguire prima che il resto delle risorse pagina di download:

<script> 
function checkURL() { 
    var old_path = '/all_products'; 
    if (window.location.pathname != old_path) { 
     // Not on an old-style URL 
     return false; 
    } 
    // Some browsers include the hash character in the anchor, strip it out 
    var product = window.location.hash.replace(/^#(.*)/, '$1'); 
    // Redirect to the new-style URL 
    var new_path = '/products'; 
    window.location = new_path + '/' + product; 
} 
checkURL(); 
</script> 

Questo controllerà l'URL della pagina corrente e reindirizzare se corrisponde al percorso vecchio stile.

Questo codice utilizza l'oggetto window.location che contiene tutte le parti dell'URL corrente già suddiviso in parti componenti.

Rendere questo script più generico è lasciato come esercizio per l'implementatore.

8

Ho aggiunto questa nuova risposta per includere alcune best practice per extracting the hash from the url e doing a redirect.

// Closure-wrapped for security. 
(function() { 
    var anchorMap = { 
      "A": "/products/A" 
      "B": "/products/B" 
      "C": "/products/C" 
    } 
    /* 
    * Best practice for extracting hashes: 
    * https://stackoverflow.com/a/10076097/151365 
    */ 
    var hash = window.location.hash.substring(1); 
    if (hash) { 
     /* 
     * Best practice for javascript redirects: 
     * https://stackoverflow.com/a/506004/151365 
     */ 
     window.location.replace(anchorMap[hash]); 
    } 
})(); 
Problemi correlati