vorrei creare un pulsante HTML che agisce come un link. così, quando si fa clic sul pulsante, si reindirizza ad una pagina. vorrei che fosse il più accessibile possibile.
mi piacerebbe anche così non ci sono caratteri aggiuntivi, o parametri nella URL.
come posso raggiungere questo obiettivo?
sulla base delle risposte finora pubblicate, Sto attualmente facendo questo:
<form method="get" action="/page2">
<button type="submit">Continue</button>
</form>
ma il problema con questo è che in Safari e Internet & nbsp; Explorer, aggiunge un carattere punto interrogativo alla fine dell'URL. ho bisogno di trovare una soluzione che non aggiunge caratteri alla fine dell'URL.
ci sono altre due soluzioni per fare questo: utilizzando JavaScript o styling un link per apparire come un pulsante.
utilizzando JavaScript:
<button onclick="window.location.href='/page2'">Continue</button>
ma questo ovviamente richiede JavaScript, e per questo motivo è meno accessibile ai lettori di schermo. il punto di un link è quello di andare in un'altra pagina. quindi cercare di fare un pulsante agire come un collegamento è la soluzione sbagliata. il mio suggerimento è che si dovrebbe usare un link e lo stile per apparire come un pulsante.
<a href="/link/to/page2">Continue</a>
En title : How to create an HTML button that acts like a link?
HTML HTML HTML HTML HTML
il modo semplice HTML è quello di metterlo in un
<form>in cui si specifica l'URL di destinazione desiderata nelactionattributo.<form action="http://google.com"> <input type="submit" value="Go to Google" /> </form>se necessario, impostare CSS
display: inline;sul modulo per tenerlo nel flusso con il testo circostante. invece di<input type="submit">nell'esempio precedente, è anche possibile utilizzare<button type="submit">. l'unica differenza è che l'elemento<button>permette ai bambini.ci si aspetta intuitivamente di poter usare
<button href="http://google.com">analogo con l'elemento<a>, ma sfortunatamente no, questo attributo non esiste secondo le specifiche HTML.CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS CSS
se CSS è consentito, è sufficiente utilizzare un
<a>che si stile a guardare come un pulsante utilizzando tra gli altri la proprietàappearance(solo Internet & nbsp; Supporto Explorer è attualmente (luglio 2015) ancora povero).a.button { -webkit-appearance: button; -moz-appearance: button; appearance: button; text-decoration: none; color: initial; }o scegliere una di quelle molte librerie CSS come Bootstrap.
JavaScript JavaScript JavaScript JavaScript
se JavaScript è consentito, impostare il
window.location.href.display: inlineal modulo per mantenere il pulsante nel flusso.GETmetodo utilizzato per impostazione predefinita dal modulo ovunque, ma in IE. è possibile passare il modulomethodaPOST, ma che avrebbe altre conseguenze, vale a dire quando si utilizza la storia per navigare indietro dopo aver fatto clic sul pulsante. può essere inevitabile (non avrà comunque alcun effetto).style="cursor:pointer;"per fare agire come un link anche.http://domain.com/search?query=test). composto che con il fatto che sarà aggiungere un punto interrogativo e sento davvero che questo non dovrebbe essere scelto come risposta corretta - incoraggia le persone a utilizzare un hack che alla fine fallirà nei casi di bordo.<a href="">è il modo corretto per creare un collegamento. inoltre si potrebbe incorrere in qualche difficoltà se il sito è https e si sta utilizzando questo metodo per collegare a una pagina non https.target="_blank"nel javascript?<form> <input TYPE="button" VALUE="Home Page" onclick="window.location.href='http://www.wherever.com'"> </form>inputnon ha un tag finale.inputè un elemento vuoto. deve avere un tag iniziale ma non deve avere un tag finale.l'unico modo per farlo (tranne per l'idea geniale forma di BalusC!) è aggiungendo un JavaScript
onclickevento al pulsante, che non è buono per l'accessibilità.hai considerato lo stile di un collegamento normale come un pulsante? non è possibile ottenere i pulsanti specifici del sistema operativo in questo modo, ma è ancora il modo migliore IMO.
uso: uso:
<a href="http://www.stackoverflow.com/"> <button>Click me</button> </a>sfortunatamente, questa marcatura non è più valida in HTML5 e non convaliderà né funzionerà sempre come potenzialmente previsto. utilizzare un altro approccio.
targetè imo sul bordo.<button onclick="location.href='http://www.example.com'" type="button"> www.example.com</button>window.location.href='http://www.example.com'? location.href non sembra funzionare per me in IE9...<button type="button" onclick="window.open('https://....', '_blank');">.se è l'aspetto visivo di un pulsante che stai cercando in un tag base HTML ancora, allora è possibile utilizzare il framework Twitter Bootstrap per formattare uno dei seguenti tipi comuni HTML link / pulsanti per apparire come un pulsante. si prega di notare le differenze visive tra la versione 2, 3 o 4 del quadro:
aspetto del campione bootstrap (v4):
aspetto del campione bootstrap (v3):
aspetto del campione bootstrap (v2):
ci sono svantaggi a fare qualcosa come il seguente?
<a class='nostyle' href='http://www.google.com/'> <span class='button'>Schedule</span> </a>dove
a.nostyleè una classe che ha il tuo link styling (dove si può sbarazzarsi dello stile link standard) espan.buttonè una classe che ha lo stile per il vostro "pulsante" (sfondo, bordo, gradiente, ecc).se si desidera creare un pulsante che viene utilizzato per un URL ovunque, creare una classe di pulsanti per un ancoraggio.
a.button { background-color: #999999; color: #FFFFFF !important; cursor: pointer; display: inline-block; font-weight: bold; padding: 5px 8px; text-align: center; -webkit-border-radius: 5px; border-radius: 5px; } .button:hover { text-decoration: none; }andando insieme a quello che alcuni altri hanno aggiunto, si può andare selvatici con solo utilizzando una semplice classe CSS senza PHP, nessun codice jQuery, solo semplice HTML e CSS.
creare una classe CSS e aggiungerlo al tuo ancoraggio. il codice è sotto.
.button-link { height:60px; padding: 10px 15px; background: #4479BA; color: #FFF; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: solid 1px #20538D; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4); -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2); } .button-link:hover { background: #356094; border: solid 1px #2A4E77; text-decoration: none; } <HTML> <a class="button-link" href="http://www.go-some-where.com" target="_blank">Press Here to Go</a>questo è tutto. è molto facile da fare e ti permette di essere creativo come vuoi. è possibile controllare i colori, le dimensioni, le forme (raggio), ecc. per ulteriori dettagli, vedere il sito che ho trovato su.
un'altra opzione è quella di creare un link nel pulsante:
quindi utilizzare i CSS per lo stile del link e pulsante, in modo che il link occupa l'intero spazio all'interno del pulsante (quindi non c'è miss-click da parte dell'utente):
button, button a{position:relative;} button a{top:0;left:0;bottom:0;right:0;}ho creato una demo qui.
è in realtà molto semplice e senza utilizzare elementi di forma. è sufficiente utilizzare il & lt; un > tag con un pulsante all'interno:).
in questo modo:
e caricherà l'href nella stessa pagina. vuoi una nuova pagina? basta usare
target="_blank".le persone che hanno risposto utilizzando
<a></a>attributi su un<button></button>è stato utile.ma poi recentemente, ho incontrato un problema quando ho usato un link all'interno di un
<form></form>.il pulsante è ora considerato come / come un pulsante di presentazione (HTML5). ho provato a lavorare in giro, e hanno trovato questo metodo.
creare un pulsante stile CSS come quello qui sotto:
.btn-style{ border : solid 1px #0088cc; border-radius : 6px; moz-border-radius : 6px; -webkit-box-shadow : 0px 0px 2px rgba(0,0,0,1.0); -moz-box-shadow : 0px 0px 2px rgba(0,0,0,1.0); box-shadow : 0px 0px 2px rgba(0,0,0,1.0); font-size : 18px; color : #696869; padding : 1px 17px; background : #eeeeee; background : -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(49%,#eeeeee), color-stop(72%,#cccccc), color-stop(100%,#eeeeee)); background : -moz-linear-gradient(top, #eeeeee 0%, #eeeeee 49%, #cccccc 72%, #eeeeee 100%); background : -webkit-linear-gradient(top, #eeeeee 0%, #eeeeee 49%, #cccccc 72%, #eeeeee 100%); background : -o-linear-gradient(top, #eeeeee 0%, #eeeeee 49%, #cccccc 72%, #eeeeee 100%); background : -ms-linear-gradient(top, #eeeeee 0%, #eeeeee 49%, #cccccc 72%, #eeeeee 100%); background : linear-gradient(top, #eeeeee 0%, #eeeeee 49%, #cccccc 72%, #eeeeee 100%); filter : progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#eeeeee',GradientType=0 ); }o crearne uno nuovo qui: CSS Button Generator
e poi crea il tuo link con un tag di classe che prende il nome dallo stile CSS che hai creato:
ecco un violino:
Fiddle di JS
se si desidera evitare di dover utilizzare un modulo o un ingresso e siete alla ricerca di un pulsante in cerca di link, è possibile creare link bello pulsante con un involucro div, un ancoraggio e un tag
h1. si potrebbe desiderare questo in modo da poter liberamente posizionare il link-pulsante intorno alla pagina. questo è particolarmente utile per i pulsanti di centraggio orizzontale e per avere al loro interno un testo centrato verticalmente. ecco come:il vostro pulsante sarà composto da tre pezzi nidificati: un involucro div, un ancoraggio, e un h1, così:
<div class="link-button-wrapper"> <a href="your/link/here"> <h1>Button!</h1> </a> </div>poi nel CSS, il tuo stile dovrebbe apparire così:
.link-button-wrapper { width: 200px; height: 40px; box-shadow: inset 0px 1px 0px 0px #ffffff; border-radius: 4px; background-color: #097BC0; box-shadow: 0px 2px 4px gray; display: block; border:1px solid #094BC0; } .link-button-wrapper > a { display: inline-table; cursor: pointer; text-decoration: none; height: 100%; width:100%; } .link-button-wrapper > a > h1 { margin: 0 auto; display: table-cell; vertical-align: middle; color: #f7f8f8; font-size: 18px; font-family: cabinregular; text-align: center; }ecco un jsfiddle per controllare e giocare con esso.
vantaggi di questa installazione: 1. fare il display dell'involucro div: il blocco rende facile centrare (usando margine: 0 auto) e posizionare (mentre un & lt; a > è inline e più difficile da posizionare e non è possibile centrare).
si potrebbe solo fare il & lt; a > display: blocco, spostarlo in giro, e lo stile come un pulsante, ma poi verticalmente allineare il testo all'interno di esso diventa difficile.
questo permette di realizzare il & lt; un > display: inline-table e il & lt; h1 > display: table-cell, che consente di utilizzare l'allineamento verticale: centrale sul & lt; h1 > e centrale verticalmente (che è sempre bello su un pulsante). sì, si potrebbe usare padding, ma se si desidera che il pulsante per ridimensionare dinamicamente, che non sarà così pulito.
a volte, quando si incorpora un & lt; a > all'interno di un div, solo il testo è cliccabile, questa impostazione rende l'intero pulsante cliccabile.
non hai a che fare con i moduli se stai solo cercando di passare ad un'altra pagina. i moduli sono destinati all'immissione di informazioni, e dovrebbero essere riservati.
consente di separare in modo pulito lo stile pulsante e lo styling del testo l'uno dall'altro (tratto vantaggio? certo, ma CSS può ottenere nasty-looking quindi è bello decomporlo).
e 'sicuramente reso la mia vita più facile lo stile di un sito web mobile per schermi di dimensioni variabili.
per HTML 5 e pulsante in stile con sfondo immagine
<a id="Navigate" href="http://www.google.com"> <input type="button" id="NavigateButton" style=" background-image: url(http://cdn3.blogsdna.com/wp-content/uploads/2010/03/Windows-Phone-7-Series-Icons-Pack.png); background-repeat: no-repeat; background-position: -272px -112px; cursor:pointer; height: 40px; width: 40px; border-radius: 26px; border-style: solid; border-color:#000; border-width: 3px;" title="Navigate" /> </a>se ciò di cui hai bisogno è che apparirà come un pulsante, con enfasi sull'immagine sfumata, puoi farlo:
ho usato questo per un sito web che attualmente sto lavorando e funziona alla grande!. se volete un po 'di stile troppo freddo metterò il CSS qui.
input[type="submit"] { background-color: white; width: 200px; border: 3px solid #c9c9c9; font-size: 24pt; margin: 5px; color: #969696; } input[type="submit"]:hover { color: white; background-color: #969696; transition: color 0.2s 0.05s ease; transition: background-color 0.2s 0.05s ease; cursor: pointer; }lavorare JSfiddle qui.
si potrebbe anche impostare i pulsanti
type-propertya "pulsante" (rende non inviare il modulo), e poi nido all'interno di un link (rende reindirizzare l'utente).in questo modo si potrebbe avere un altro pulsante nella stessa forma che invia il modulo, nel caso in cui è necessario. penso anche che questo è preferibile nella maggior parte dei casi sopra l'impostazione del metodo di forma e l'azione di essere un collegamento (a meno che non sia una ricerca-forma credo...)
esempio: esempio:
in questo modo il primo pulsante reindirizza l'utente, mentre il secondo invia il modulo.
fare attenzione a assicurarsi che il pulsante non attiva alcuna azione, in quanto ciò si tradurrà in un conflitto. anche come ha sottolineato Arius, si dovrebbe essere consapevoli che, per la ragione di cui sopra, questo non è strettamente parlando considerato HTML valido, secondo lo standard. funziona tuttavia come previsto in Firefox e Chrome, ma non ho ancora testato per Internet & nbsp; Explorer.
se si utilizza un modulo interno, aggiungere il tipo di attributo = "reset" insieme all'elemento pulsante. impedirà l'azione di forma.
<button type="reset" onclick="location.href='http://www.example.com'"> www.example.com </button>so che ci sono state un sacco di risposte presentate, ma nessuno di loro sembrava davvero inchiodare il problema. ecco la mia opinione a una soluzione:
<form method="get">con cui il sistema operativo sta iniziando. questo funziona davvero bene, ma a volte aggiunge un?all'URL. il?è il problema principale.?non finisce aggiunto alla URL. sarà senza soluzione di continuità ricaduta al metodo<form>per la frazione molto piccola di utenti che non hanno JavaScript abilitato.<form>o<button>anche esistere. sto usando jQuery in questo esempio, perché è veloce e facile, ma può essere fatto in 'vaniglia' JavaScript pure.<form>action.esempio di JSBin (il frammento di codice non può seguire i link)
// Listen for any clicks on an element in the document with the `link` class $(document).on('click', '.link', function(e) { // Prevent the default action (e.g. submit the form) e.preventDefault(); // Get the URL specified in the form var url = e.target.parentElement.action; window.location = url; });<!DOCTYPE html> <html> <head> <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script> <meta charset="utf-8"> <title>Form buttons as links</title> </head> <body> <!-- Set `action` to the URL you want the button to go to --> <form method="get" action="http://stackoverflow.com/questions/2906582/how-to-create-an-html-button-that-acts-like-a-link"> <!-- Add the class `link` to the button for the event listener --> <button type="submit" class="link">Link</button> </form> </body> </html>come HTML5, pulsanti supportano l'attributo
formaction. meglio di tutto, non è necessario Javascript o trucchi.caverne
<form>tag.<button>tipo deve essere "submit" (o non specificato), non potevo farlo lavorare con il tipo "pulsante." che porta il punto sotto.riferimento: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-formaction Supporto del browser: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Browser_compatibility
formactionè compatibile dal momento che "IE mondo" dalla versione 10 e sopra<button formaction>= = =<form action>?<form>s in ciascuno dei nostri esempi. èformactionsu unbuttondovrebbe aggiungere il?ad una presentazione GET vuota? in questo JSBin sembra che l'HTML si comporti esattamente allo stesso modo per entrambi.formaction='#anchor'.?sulla URL. questo è causato dal modulo che ètype="GET", cambiare questo atype="POST"e il?alla fine della URL scompare. questo perché GET invia tutte le variabili nell'URL, da qui il?.GETfallirà. penso ancora che utilizzando un link senso con la avvertenza che non reagirà alla "barra spaziatrice" quando attivo come il pulsante fa. anche qualche stile e comportamento saranno diversi (come il dragaggable). se si desidera che il vero "button-link" esperienza, avendo lato server reindirizza per la finitura URL da?per rimuoverlo potrebbe essere anche un'opzione.sembra che ci siano tre soluzioni a questo problema (tutte con pro e contro).
soluzione 1: pulsante in forma.
<form method="get" action="/page2"> <button type="submit">Continue</button> </form>ma il problema con questo è che in qualche versione dei browser più diffusi come Chrome, Safari e Internet Explorer, aggiunge un carattere punto interrogativo alla fine dell'URL. quindi in altre parole per il codice sopra il tuo URL finirà per assomigliare a questo:
c'è un modo per risolvere questo problema, ma richiede una configurazione lato server. un esempio che utilizza Apache Mod _ rewrite sarebbe quello di reindirizzare tutte le richieste con un finale
?alla loro URL corrispondente senza il?. ecco un esempio usando .htaccess, ma c'è un thread completo qui:RewriteCond %{THE_REQUEST} \?\ HTTP [NC] RewriteRule ^/?(index\.cfm)? /? [R=301,L]configurazioni simili possono variare a seconda del server web e dello stack utilizzato. quindi un riassunto di questo approccio:
Pro: Pro:
contro: contro:
?sembra brutto in alcuni browser. questo può essere risolto da un hack (in alcuni casi) utilizzando POST invece di GET, ma il modo pulito è quello di avere un server-side redirect. il rovescio della medaglia con il lato server redirect è che causerà una chiamata HTTP supplementare per questi collegamenti a causa del 304 redirect.<form>soluzione 2: usare JavaScript.
è possibile utilizzare JavaScript per attivare onclick e altri eventi per imitare il comportamento di un link utilizzando un pulsante. l'esempio qui sotto potrebbe essere migliorato e rimosso dall'HTML, ma è lì semplicemente per illustrare l'idea:
Pro: Pro:
contro: contro:
soluzione 3: ancoraggio (link) in stile come un pulsante.
styling di un link come un pulsante è relativamente facile e in grado di fornire un'esperienza simile in diversi browser. bootstrap fa questo, ma è anche facile da raggiungere da soli utilizzando stili semplici.
Pro: Pro:
<form>per funzionare.contro: contro:
keypresseventi sui pulsanti.conclusione conclusione conclusione conclusione
soluzione # 1 (Pulsante in una forma) sembra il più trasparente per gli utenti con il minimo lavoro richiesto. se il layout non è influenzato da questa scelta e il tweak lato server è fattibile, questa è una buona opzione per i casi in cui l'accessibilità è la priorità (ad esempio link su una pagina di errore o messaggi di errore).
se JavaScript non è un ostacolo ai vostri requisiti di accessibilità, allora la soluzione # 2 (JavaScript) sarebbe preferito su # 1 e # 3.
se per qualche ragione, l'accessibilità è vitale (JavaScript non è un'opzione), ma siete in una situazione in cui il vostro design e / o la configurazione del server vi impedisce di utilizzare l'opzione # 1, allora la soluzione # 3 (Anchor in stile come un pulsante) è una buona alternativa per risolvere questo problema con un impatto minimo di usabilità.
anche Lei può usare un pulsante:
per esempio, nella sintassi ASP.NET Core:
// Some other tags <form method="post"> <input asp-for="YourModelPropertyOrYourMethodInputName" value="@TheValue" type="hidden" /> <button type="submit" class="link-button" formaction="/TheDestinationController/TheDestinationActionMethod"> @(TextValue) </button> </form> // Other tags... <style> .link-button { background: none !important; border: none; padding: 0 !important; color: #20a8d8; cursor: pointer; } </style>puoi semplicemente mettere un tag intorno all'elemento:
text-decorationper quella classe anone).<button>all'interno di<a>.@Nicolas,following ha funzionato per me come il vostro non ha avuto
type="button"a causa della quale ha iniziato a comportarsi come tipo di invio.. dal momento che ho già uno presentare type.it non ha funzionato per me.... e ora è possibile aggiungere classe al pulsante o per<a>per ottenere layout richiesto:<a href="http://www.google.com/"> <button type="button">Click here</button> </a>se si desidera reindirizzare per le pagine che risiedono all'interno del tuo sito web, quindi ecco il mio metodo - Ho aggiunto l'attributo href al pulsante, e onclick assegnato this.getAttributes ('href') a document.location.href
* * Non funziona se si fa riferimento per URL outsite del dominio a causa di 'X-Frame-Options' a 'sameorigence'.
codice di esempio:
<button onclick="document.location.href=this.getAttribute('href');" href="/">Home</button>perché non posizionare semplicemente il pulsante all'interno di un tag di riferimento ad esempio
questo sembra funzionare perfettamente per me e non aggiunge alcun 20% tag al link, proprio come si desidera. ho usato un link a google per dimostrare.
si potrebbe naturalmente avvolgere questo in un tag forma, ma non è necessario.
quando si collega un altro file locale basta metterlo nella stessa cartella e aggiungere il nome del file come riferimento. oppure specificare la posizione del file se in non è nella stessa cartella.
questo non aggiunge alcun carattere alla fine dell'URL sia, tuttavia ha il percorso del progetto file come l'url prima di finire con il nome del file. per esempio ad esempio
se la mia struttura di progetto era...
.. denota una cartella - denota un file mentre quattro | denotare una sottodirectory o un file nella cartella padre
.. pubblico | | | |.. html | | | | | | | | | | | -main.html | | | | | -secondary.html
se apro main.html l'URL sarebbe,
tuttavia, quando ho cliccato sul pulsante interno main.html per passare a secondary.html, l'URL sarebbe,
nessun carattere speciale incluso alla fine dell'URL. spero che questo aiuti. a proposito - (% 20 denota uno spazio in un URL suo codificato e inserito nel luogo di loro.)
nota: il localhost: 0000 ovviamente non sarà 0000 si avrà il proprio numero di porta lì.
inoltre il? _ ijt = xxxxxxxxxxxxxxxx alla fine del main.html URL, x è determinato dalla propria connessione così ovviamente non sarà uguale al mio.
potrebbe sembrare che sto affermando alcuni punti davvero di base, ma voglio solo spiegare come meglio posso. grazie per la lettura e spero che questo aiuto qualcuno almeno. buona programmazione.
è possibile utilizzare javascript:
<html> <button onclick='window.location = "http://www.google.com"'> Google </button> </html>sostituire
http://www.google.comcon il tuo sito web, assicurarsi di includerehttp://prima dell'URL.7 modi per farlo:
window.location.href = 'URL'window.location.replace('URL')window.location = 'URL'window.open('URL')window.location.assign('URL')<!-- Using window.location.href = 'URL' --> <button onclick='window.location.href = "https://stackoverflow.com"'> Click Me </button> <!-- Using window.location.replace('URL') --> <button onclick='window.location.replace("https://stackoverflow.com")'> Click Me </button> <!-- Using window.location = 'URL' --> <button onclick='window.location = "https://stackoverflow.com"'> Click Me </button> <!-- Using window.open('URL') --> <button onclick='window.open("https://stackoverflow.com","_self","","")'> Click Me </button> <!-- Using window.location.assign('URL') --> <button onclick='window.location.assign("http://www.stackoverflow.com")'> Click Me </button> <!-- Using HTML form --> <form action='https://stackoverflow.com' method='get'> <input type='submit' value='Click Me'/> </form> <!-- Using HTML anchor tag --> <a href='https://stackoverflow.com'> <button>Click Me</button> </a>in JavaScript
setLocation(base: string) { window.location.href = base; }in HTML
<button onclick="setLocation('/<whatever>')>GO</button>"