Como remover “onclick” com JQuery?

99

Código PHP:

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

Desejo remover o onclick="check($id,1)para que o link não possa ser clicado ou " check($id,1)não seja disparado. Como posso fazer isso com JQuery?

Steven
fonte

Respostas:

237

Old Way (pré-1.7):

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

Novo Caminho (1.7+):

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

(Substitua ... pelo seletor de que você precisa.)

glmxndr
fonte
26
Não deveria ser removeAttr ('onclick')?
Roatin Marth
Sim, bom ponto, pode ser mais limpo, mas não tenho certeza se seria diferente do ponto de vista da execução.
glmxndr
6
Com o jQuery 1.7+, você pode ligar / desligar: stackoverflow.com/questions/209029/…
Lance Cleveland
6
Veja o primeiro comentário em 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 sim, isso está na documentação, mas eu tive que usar .prop()para o IE11 também.
onetwo12
58

Eu sei que isso é muito antigo, mas quando um estranho perdido encontra essa pergunta em busca de uma resposta (como eu fiz), então esta é a melhor maneira de fazer isso, em vez de usar removeAttr ():

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

Citando o doku oficial do jQuerys :

"Remover um manipulador de eventos onclick embutido usando .removeAttr () não atinge o efeito desejado no Internet Explorer 6, 7 ou 8. Para evitar possíveis problemas, use .prop () em vez disso"

acme
fonte
1
Descobri que esta é a melhor forma de remover um evento onlick quando você o digita assim. <span onlick="method()">sometext>/span>O evento é totalmente desvinculado e funciona muito bem
zdarsky.peter
3
Não acho que seja a melhor maneira. jsfiddle.net/TN2wr vs jsfiddle.net/TN2wr/1
Gus
Estou usando um JQ anterior a 1.6, portanto, $ (element) .attr ('onclick', null); funciona para mim.
metamagikum
18

Removendo onclickpropriedade

Suponha que você tenha adicionado seu evento de clique embutido, assim:

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

Então, você pode remover o evento assim:

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

Removendo clickouvintes de eventos

Suponha que você tenha adicionado seu evento de clique definindo um ouvinte de evento, como este:

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

... ou assim:

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

Então, você pode remover o evento assim:

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

Removendo ambos

Se não tiver certeza de como seu evento foi adicionado, você pode combinar os dois, desta forma:

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

se você estiver usando jquery 1.7

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

outro

$('html').unbind('click');
Jaydeep Jadav
fonte
10

É muito fácil usar removeAttr.

$(element).removeAttr("onclick");
Nem Leyva López
fonte
5

Depois de tentar tanto com bind, unbind, on, off, click, attr, removeAttr, prop eu fiz funcionar. Portanto, tenho o seguinte cenário: No meu html, NÃO anexei nenhum manipulador onclick embutido.

Então, em meu Javascript, usei o seguinte para adicionar um manipulador onclick embutido:

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

Para remover isso mais tarde do Javascript, usei o seguinte:

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

Esta é a maneira que funcionou para mim vincular e desvincular eventos de clique dinamicamente em Javascript. Lembre-se de NÃO inserir nenhum manipulador onclick embutido em seus elementos.

bboydflo
fonte
Eu gosto disso, mas por que um seria prop e o outro attr?
Stachu de
Não tenho certeza, mas vejo isso é que com attr você adiciona / injeta o manipulador onclick com o myFunction () correspondente e o prop ('onclick', null) remove o atributo, então nenhuma função será chamada. É assim que funcionou para mim. E pude notar como o elemento tinha o manipulador onclick via attr e como ele era removido após o prop.
bboydflo
1
Para referência futura, você realmente deve usar .on('click', myFunction)(note que nãomyFunction está entre aspas) e, mais tarde,.off('click')
JDB ainda se lembra de Monica
1

E se o evento onclick não estiver diretamente no elemento, mas no elemento pai? Isso deve funcionar:

$(".noclick").attr('onclick','').unbind('click');
$(".noclick").click(function(e){
    e.preventDefault();
    e.stopPropagation();
    return false;
});
Milão
fonte
Adicionar outro ouvinte de clique (para evitar padrão, etc.) pode adicioná-lo ao final da lista de ouvintes e, portanto, os outros ouvintes ainda seriam executados primeiro. Não tenho certeza se é adicionado primeiro ou último à lista. De qualquer forma, é melhor usar 'off' como visto em outras respostas.
Frederic Leitenberger
0

Tente fazer isso se você desvincular o evento onclick por ID. Em seguida, use:

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

Tente fazer isso se você desvincular o evento onclick pela classe. Em seguida, use:

$('.className').attr('onclick','').unbind('click');
Vishnu Sharma
fonte