2012-04-15 12 views
7

Ho esaminato tonnellate di esempi negli ultimi due giorni, ma non riesco ancora a trovare una risposta al mio dilemma. Per farmi spiegare il mio dilemma prima ti mostrerò un esempio di qualcosa che ho che funziona, poi spiegherò come preferirei che funzioni (ma non riesco a ottenere risultati).Aprire la pagina in una nuova scheda utilizzando javascript window.open (elementName.elementValue) nel tag di ancoraggio

Questo funziona:

<form> 
<select name="url"> 
    <option selected="selected" value=""> Choose Donation Amount </option> 
    <option value="http://www.url1.com">URL#1</option> 
    <option value="http://www.url2.com">URL#2</option> 
    <option value="http://www.url3.com">URL#3</option> 
    <option value="http://www.url4.com">URL#4</option> 
    <option value="http://www.url5.com">URL#5</option> 
    <option value="http://www.url6.com">URL#6</option> 
</select> 
<input type="submit" value="Submit" onclick="if (url.value) window.open(url.value);" /> 
</form> 

Ma quello che preferisco fare è catturare l'opzione e aprire l'URL utilizzando un tag di ancoraggio (piuttosto che di input [tipo "submit"]), qualcosa di simile (a sostituire il tag di ingresso prima del tag forma chiusura):

<a href="javascript:void(if (url.value) window.open(url.value));" target="_blank">Submit</a> 

la riga precedente non funziona, e non riesco a capire come formare correttamente. Aiuto?

So che questo non sembra logico, tanto più che ho già funzionato utilizzando un pulsante di invio, ma non è neanche pratico per me spiegare esattamente perché non desidero utilizzare input o pulsante type = "submit ",, o PHP. Per favore, ha davvero bisogno di essere in linea javascript in un tag di ancoraggio. Thanks.s :-)

risposta

7

Aggiungi il tuo modulo di attributo name come:

<form name="form"> 

... e poi provare così:

<a href="" onclick="window.open(form.url.value, 'windowName'); return false" target="_blank">Submit</a> 

C'è una example lavoro.

+0

Questo funziona in Chrome 18 ma non in Firefox 10 (in esecuzione su OS X 10.6). Non ho testato altri browser/piattaforme. In FF si apre semplicemente una pagina vuota. – Jeff

+0

Capisco .. Hai ragione .. Ho aggiornato la risposta .. Non è la soluzione migliore ma funziona .. – PrimosK

+0

Grazie !! Questa è la soluzione che si adatta alle mie esigenze! Lo apprezzo davvero. :-) – Jeff

1

questo ha funzionato fino ad ora, anche se è lungo

<a href="javascript:void((function(){ val=document.getElementsByName('url')[0].value; if(val) window.open(val)})())">click</a>

1

Non so il motivo per cui si dispone di utilizzare il modulo se si desidera solo per aprire un URL durante la selezione di un'opzione. Leggi il codice qui sotto:

<select name="url" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"> 

Questo funziona bene su ogni browser Anche su IE5.

0

È possibile dimenticare l'uso di JavaScript perché il browser controlla se si apre o meno in una nuova scheda. La soluzione migliore è quella di fare qualcosa di simile alla seguente invece:

<form action="http://www.yoursite.com/dosomething" method="get" target="_blank"> 
    <input name="dynamicParam1" type="text"/> 
    <input name="dynamicParam2" type="text" /> 
    <input type="submit" value="submit" /> 
</form> 

questo sarà sempre aperto in una nuova scheda del browser, indipendentemente da quale un client utilizza grazie all'attributo target="_blank".

Se tutto ciò che serve è quello di reindirizzare senza parametri dinamici è possibile utilizzare un collegamento con l'attributo target="_blank":

<a href="http://www.youresite.com" target="_blank">redirect</a> 
0

Abbiamo avuto anche un requisito analogo. Volevamo generare l'URL href dal lato server utilizzando una chiamata Ajax quando l'utente fa clic su di esso. dopo aver fatto molte ricerche, abbiamo scoperto che in realtà è controllato dal browser. In chrome la pagina appena aperta si apre come un popup ed è bloccata dal blocco popup. La maggior parte degli utenti della nostra applicazione sono stati confusi da tale comportamento. Questa è la soluzione che abbiamo usato. Spero che questo aiuti qualcuno che ha il problema simile.

Possiamo avere un collegamento regolare che punta a una pagina Web effettiva che abbiamo nel nostro sito chiamato LandingPage.html.Dobbiamo impostare l'obiettivo su "_blank" per aprire la finestra nella stessa scheda del browser.

<a href="LandingPage.html" id="fakeLink" target="_blank">Click to open google in the same browser window</a> 

Abbiamo quindi allegato all'evento click dell'elemento di ancoraggio fakeLink.

$('#fakeLink').click(function(){ 
     $.ajax({ 
      url: "" 
     }).done(function() { 
      localStorage.setItem('url', 'https://www.google.lk'); 
     }); 
    }); 

Siamo in grado di eseguire la chiamata AJAX e recuperare l'URL generati dinamicamente dal server. quindi possiamo aggiungere l'url alla cartella locale.

La pagina di destinazione può contenere un testo per indicare agli utenti che verranno reindirizzati in un secondo. "Sarai reindirizzato su google in 1 secondo."

Nella pagina di destinazione, possiamo avere un settimeout e all'interno di quella funzione, possiamo usare un window.location per reindirizzare l'utente alla pagina effettiva.

setTimeout(function(){ 
     window.location.assign(localStorage.getItem('url')); 
    }, 1000); 

Spero che questo aiuti, Questo dovrebbe funzionare in tutti i browser, ho controllato solo in IE 10 e Chrome dal momento che non stiamo usando qualsiasi cose correlate del browser.

Problemi correlati