1. casa
  2. Domanda e risposta
  3. Javascript protocollo ed eventi

Javascript protocollo ed eventi

2010-06-05 12 views
5

Cosa significa il seguente codice -Javascript protocollo ed eventi

<a href="javacsript:;" onClick="addItem(160)">some link</a>

Il mio dubbio di base è che lo script viene eseguito quando si clicca sul link

fonte

2010-06-05 ayush

risposta

3

Il onclick verrà eseguito prima. Se onclick non restituisce false (in questo caso non lo è), verrà elaborato l'href.

fonte

2010-06-05 05:39:59 Matt

+0

e quale script verrà chiamato quando viene elaborato l'href? – ayush

+0

Nell'esempio, verrà elaborato JavaScript inline ('javascript:;'). Se href era un normale URL, il browser avrebbe solo navigato verso di esso. – Matt

+0

Niente. L'autore probabilmente pensa che questo sia un buon modo per impedire che l'ancora spinga su un'altra pagina se l'onclick non restituisce false. Vedrai anche javascript: void() molto. In realtà è meglio assicurarsi che l'evento onclick restituisca false e, in caso contrario, assicurati che href torni a un fallback di qualche tipo. O, non usare affatto il tag di ancoraggio. – Andrew

0

vostro dubbio è vero, è necessario trovare "la funzione addItem (x)" in un file JavaScript che collegava da tag script dalla pagina (di solito in tag head)

fonte

2010-06-05 05:42:22 sirvan

+0

la funzione addItem è presente in uno dei file di script. il mio dubbio è che ciò che succederebbe se addItem restituisse false? – ayush

0

Il "javascript:"!. All'interno href è un modo per dire al browser di eseguire javascript invece di andare a una pagina diversa.

Questa riga, ad esempio, mostrerà una finestra di messaggio con messaggio "testing".

<a href="javascript:alert('testing');">Click me</a>

e questo eseguirà una dichiarazione javascript vuoto che farà nulla

<a href="javacsript:;">Click me</a>

L'onclick è un evento che spara anche quando un link viene cliccato. Al contrario di href non ti permette di inserire un link a una pagina diversa; accetta solo javascript.

I browser apriranno prima l'evento onclick e quindi elaborano l'attributo href. Se si tratta di un URL (href vuoto significa URL corrente, clic farà solo aggiornare la pagina) lo seguirà, se è javascript lo eseguirà.

Inserire "javascript :;" o "javascript: void (null);" all'interno href è vecchio e errato tecnica per garantire che il browser non aggiorni la pagina dopo che è stato elaborato onclick.

Per rispondere alla domanda; entrambi gli script verranno eseguiti, ma lo script href non farà nulla.

fonte

2010-06-05 06:08:59 Luc

+0

Non così semplice, @Luc !! Guarda cosa succede se lo script restituisce effettivamente un valore! – Pointy

2

La parte javascript nell'attributo href è il protocollo (si sa, come http, ftp o mailto). Quello che fa è dire al browser che l'URL è in realtà un codice JavaScript.

Normalmente, quando si fa clic su un collegamento, il browser eseguirà qualsiasi cosa trovi nell'attributo href. Tuttavia, il browser attiverà anche l'evento onclickprima del che gestisce la cosa di href. Quindi, l'impostazione di un gestore onclick sovrascriverà il normale comportamento.

Pertanto, il gestore eventi diventa re e ha la possibilità di consentire o impedire il comportamento predefinito del browser restituendo true (autorizzazione) o false (prevenzione).

Quindi, nel tuo esempio, quando fai clic su quel collegamento, il browser attiverà addItem. Se restituisce false, non succede nulla. Se restituisce true, il browser eseguirà il codice nell'attributo href. Ma dal momento che non trova alcuna dichiarazione (cioè, una dichiarazione vuota), non succede nulla.

provare il seguente codice:

<a href="http://google.com/" onclick="return false;">won't go to google.com</a> 
<a href="http://google.com/" onclick="return true;">will go to google.com</a>

Ha senso per te?

fonte

2010-06-05 08:56:36 Oblio

0

Si noti che quando il browser interpreta il valore "javascript:" di un "href", se il valore restituito non è vuoto , viene interpretato come il contenuto del documento desiderato per il tag <a>! Ecco una pagina di prova per il tuo divertimento:

http://gutfullofbeer.net/jslink.html

La fonte per quella pagina (vedere le cose: è molto breve) comprende il seguente link:

<a href='javascript:getLink()'>Click to go there!</a>

La funzione "getLink()" è definito come segue:

function getLink() { 
    var sel = document.getElementById('sel'); 
    return sel.options[sel.selectedIndex].value; 
    }

come si vede, la funzione afferra il valore corrente selezionato del <select> elemento sulla pagina e restituisce quello. Come si presenta l'elemento ?

<select id='sel'> 
    <option value='<html><head><meta http-equiv="refresh" content="2;http://cnn.com"/></head><body>Redirecting to CNN ...</body></html>'>CNN</option> 

    <option value='<html><head><meta http-equiv="refresh" content="2;http://zombo.com"/><head><body>Redirecting to Zombocom ...</body></html>'>Zombocom</option> 
    <option value='<html><head><meta http-equiv="refresh" content="2;http://reddit.com"/></head><body>Redirecting to Reddit ...</body></html>'>Reddit</option> 
</select>

I valori di tali opzioni sono il markup HTML completo per una pagina con un reindirizzamento al sito richiesto. Poiché l'URL restituisce un valore, tale valore viene interpretato dal browser come il nuovo contenuto della pagina.

È piuttosto strabiliante. Non sono sicuro del perché lo faresti mai.

fonte

2010-06-05 11:48:58 Pointy

Problemi correlati

 Problemi correlati