2011-10-13 11 views
139

Ho visto il seguente href usato di volta in volta nelle pagine web. Tuttavia, non capisco cosa stia tentando di fare o la tecnica. Qualcuno può elaborare per favore?Cosa fa l'espressione href <a href="javascript:;"></a>?

<a href="javascript:;"></a> 
+2

È possibile chiamare un metodo JS con questo se non sbaglio .. javascript: SomeFunction() – Rob

+1

Non sta tentando di fare qualcosa che non può essere gestito meglio con un gestore di click adeguato. Dovresti evitare questo perché è brutto, inaccessibile e ha spinto le persone a usare lo schema 'javascript:' dove non dovrebbe essere usato ('onclick =" javascript: ... "') – Gareth

+1

Controlla questo: http: // stackoverflow. com/a/138233/908879 – ajax333221

risposta

150

Un elemento <a> non è valido HTML a meno che non sia un attributo href o name.

Se si desidera renderlo correttamente come collegamento (ad esempio sottolineato, puntatore a mano, ecc.), Lo farà solo se ha un attributo href.

Codice come questo è quindi talvolta utilizzato come un modo per creare un collegamento, ma senza dover fornire un URL effettivo nell'attributo href. Ovviamente lo sviluppatore voleva che il collegamento non facesse nulla, e questo era il modo più semplice che conoscesse.

Probabilmente ha qualche codice di evento javascript altrove che viene attivato quando si fa clic sul collegamento, e quello sarà ciò che vuole effettivamente accadere, ma vuole che assomigli ad un normale link di tag <a>.

Alcuni sviluppatori utilizzano lo href='#' per lo stesso scopo, ma ciò fa sì che il browser salti in cima alla pagina, che potrebbe non essere richiesto. E non poteva semplicemente lasciare il href vuoto, perché href='' è un collegamento alla pagina corrente (cioè provoca un aggiornamento della pagina).

Ci sono modi per aggirare queste cose. L'uso di un bit vuoto di codice Javascript nello href è uno di questi e, sebbene non sia la soluzione migliore, funziona.

+11

Per curiosità, c'è un modo migliore per farlo? –

+20

una cosa migliore è che se la funzione evento restituisce false; oppure 'event.preventDefault()', l'azione 'href' non verrà mai chiamata, quindi puoi inserire qualcosa di più sensato. – Spudley

-1
<a href="javascript:void(0);"></a> 

javascript: dice al browser intenzione di scrivere codice javascript

+1

http://stackoverflow.com/a/1293130/681538 – Alex

5
<a href="javascript:alert('Hello');"></a> 

è solo una scorciatoia per:

<a href="" onclick="alert('Hello'); return false;"></a> 
+2

Un po 'ma non è un vero confronto "like for like". Quale è una ragione alcuni cadono nella trappola di usarlo in primo luogo. – Lankymart

21

fondamentalmente invece di utilizzare il link per spostare le pagine (o tasselli), utilizzando questo metodo avvia una funzione javascript

<script> 
function doSomething() { 
    alert("hello") 
} 
</script> 
<a href="javascript:doSomething();">click me</a> 

facendo clic sul collegamento verrà generato l'avviso.

21

Esistono diversi meccanismi per evitare che un collegamento raggiunga la sua destinazione. Quello dalla domanda non è molto intuitivo.

Un'opzione più pulita è quella di utilizzare href="#no" dove #no è un'ancora non definita nel documento.

È possibile utilizzare un nome più semantico come #disable o #action per aumentare la leggibilità.

vantaggi dell'approccio:

  • evita il "movimento verso l'alto" effetto del vuoto href = "#"
  • evita l'uso di javascript

Inconvenienti :

  • Devi essere sicuro che il nome dell'ancora non sia usato nel documento.

Poiché l'elemento <a> non agisce come un link, l'opzione migliore in questi casi non utilizza un elemento <a> ma un <div> e fornire lo stile di collegamento come desiderato.

+6

Anche l'ancoraggio non definito mi piace. Tuttavia, un altro svantaggio è che aggiunge l'ancora alla cronologia del browser, quindi opto per utilizzare il metodo JS vuoto nell'OP. –

5

fare riferimento a questo:

<a href="Http://WWW.stackoverflow.com">Link to the website opened in different tab</a> 
<a href="#MyDive">Link to the div in the page(look at the chaneged url)</a> 
<a href="javascript:;">Nothing happens if there is no javaScript to render</a> 
3

thread vecchio ma ho pensato solo aggiungere che gli sviluppatori motivo Utilizza questo costrutto non è quello di creare un link morto, ma perché JavaScript URL per qualche motivo non passano i riferimenti all'elemento html attivo correttamente.

ad es. handler_function(this.id) funziona come onClick ma non come un URL javascript.

Quindi è una scelta tra la scrittura di codice pedanticamente conforme agli standard che comporta il dover regolare manualmente la chiamata per ciascun collegamento ipertestuale, o un codice leggermente non standard che può essere scritto una sola volta e utilizzato ovunque.

0

Il modo migliore per rendere sempre un collegamento corretto è con il css come segue:

a {cursor: pointer !important} 

si dovrebbe evitare di seguire le cose non necessarie, come indicato nel thread.

Problemi correlati