Come rimuovere "onclick" con JQuery?


100

Codice PHP:

<a id="a$id" onclick="check($id,1)" href="javascript:void(0)"  class="black">Qualify</a>

Desidero rimuovere il in onclick="check($id,1)modo che il collegamento non possa essere cliccato o " check($id,1)non venga attivato. Come posso farlo con JQuery?

Risposte:


238

Old Way (pre-1.7):

$("...").attr("onclick", "").unbind("click");

New Way (1.7+):

$("...").prop("onclick", null).off("click");

(Sostituisci ... con il selettore che ti serve.)


26
Non dovrebbe essere removeAttr ('onclick')?
— Roatin Marth

Sì, buon punto, potrebbe essere più pulito, ma non sono sicuro che sarebbe diverso dal punto di vista dell'esecuzione.
— glmxndr

6
Con jQuery 1.7+ puoi usare on / off: stackoverflow.com/questions/209029/…
— Lance Cleveland

6
Vedi il primo commento su removeAttr api.jquery.com/removeattr Removing an inline onclick event handler using .removeAttr() doesn't achieve the desired effect in Internet Explorer 6, 7, or 8. To avoid potential problems, use .prop() instead
— andyface

2
@andyface sì che è nella documentazione, ma ho dovuto usare anche .prop()per IE11.
— 12

58

So che questo è abbastanza vecchio, ma quando uno sconosciuto smarrito trova questa domanda cercando una risposta (come ho fatto io), questo è il modo migliore per farlo, invece di usare removeAttr ():

$element.prop("onclick", null);

Citando il doku ufficiale di jQuerys :

"La rimozione di un gestore di eventi onclick inline utilizzando .removeAttr () non ottiene l'effetto desiderato in Internet Explorer 6, 7 o 8. Per evitare potenziali problemi, utilizza invece .prop ()"


1
Ho scoperto che questo è il modo migliore per rimuovere l'evento onlick quando lo hai digitato in questo modo. <span onlick="method()">sometext>/span>L'evento è completamente svincolato e funziona alla grande
— zdarsky.peter

3
Non credo che questo sia il modo migliore. jsfiddle.net/TN2wr vs jsfiddle.net/TN2wr/1
— Gus

Sto usando un JQ più vecchio di 1.6 quindi $ (element) .attr ('onclick', null); per me va bene.
— metamagikum

18

Rimozione della onclickproprietà

Supponi di aver aggiunto il tuo evento clic in linea, in questo modo:

<button id="myButton" onclick="alert('test')">Married</button>

Quindi, puoi rimuovere l'evento in questo modo:

$("#myButton").prop('onclick', null); // Removes 'onclick' property if found

Rimozione dei clicklistener di eventi

Supponi di aver aggiunto il tuo evento clic definendo un listener di eventi, in questo modo:

$("button").on("click", function() { alert("clicked!"); });

... o così:

$("button").click(function() { alert("clicked!"); });

Quindi, puoi rimuovere l'evento in questo modo:

$("#myButton").off('click');          // Removes other events if found

Rimozione di entrambi

Se non sei sicuro di come sia stato aggiunto il tuo evento, puoi combinarli entrambi, in questo modo:

$("#myButton").prop('onclick', null)  // Removes 'onclick' property if found
              .off('click');          // Removes other events if found

17

se stai usando jquery 1.7

$('html').off('click');

altro

$('html').unbind('click');


5

Dopo aver provato così tanto con bind, unbind, on, off, click, attr, removeAttr, prop, l'ho fatto funzionare. Quindi, ho il seguente scenario: Nel mio HTML NON ho collegato alcun gestore onclick in linea.

Quindi nel mio Javascript ho usato quanto segue per aggiungere un gestore onclick in linea:

$(element).attr('onclick','myFunction()');

Per rimuoverlo in un secondo momento da Javascript ho usato quanto segue:

$(element).prop('onclick',null);

Questo è il modo in cui ha funzionato per me associare e svincolare dinamicamente gli eventi di clic in Javascript. Ricorda di NON inserire alcun gestore onclick in linea nei tuoi elementi.


Mi piace, ma perché uno dovrebbe essere prop e l'altro attr?
— Stachu

Non ne sono sicuro, ma il modo in cui lo vedo è che con attr si aggiunge / si inietta il gestore onclick con la corrispondente myFunction () e il prop ('onclick', null) rimuove l'attributo, quindi nessuna funzione verrà chiamata. Questo è il modo in cui ha funzionato per me. E ho potuto notare come l'elemento aveva un gestore onclick tramite attr e come è stato rimosso dopo il puntello.
— bboydflo

1
Per riferimento futuro, dovresti davvero usare .on('click', myFunction)(nota che nonmyFunction è tra virgolette) e poi, più tardi,.off('click')
— JDB ricorda ancora Monica

1

E se l'evento onclick non è direttamente sull'elemento, ma dall'elemento genitore? Questo dovrebbe funzionare:

$(".noclick").attr('onclick','').unbind('click');
$(".noclick").click(function(e){
    e.preventDefault();
    e.stopPropagation();
    return false;
});

L'aggiunta di un altro listener di clic (per impedire l'impostazione predefinita, ecc.) Potrebbe aggiungerlo alla fine dell'elenco dei listener e quindi gli altri listener verranno comunque eseguiti per primi. Non sono sicuro se viene aggiunto per primo o per ultimo all'elenco. Comunque è meglio usare 'off' come visto in altre risposte.
— Frederic Leitenberger

0

Prova questo se svincoli l'evento onclick tramite ID Quindi usa:

$('#youLinkID').attr('onclick','').unbind('click');

Prova questo se svincoli l'evento onclick per Classe Quindi usa:

$('.className').attr('onclick','').unbind('click');
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.