3.1 KiB
title | localeTitle |
---|---|
Click Method | Clique em Método |
Clique em Método
O método jQuery Click aciona uma função quando um elemento é clicado. A função é conhecida como "manipulador", pois manipula o evento click. Funções podem impactam o elemento HTML que está vinculado ao clique usando o método jQuery Click ou podem alterar algo totalmente. A forma mais utilizada é:
$("#clickMe").click(handler)
O método click usa a função handler como argumento e a executa toda vez que o elemento #clickMe
é clicado. A função de manipulador recebe um parâmetro conhecido como eventObject que pode ser útil para controlar a ação.
Exemplos
Este código mostra um alerta quando um usuário clica em um botão:
<button id="alert">Click Here</button>
$("#alert").click(function () {
alert("Hi! I'm an alert");
});
O eventObject tem alguns métodos integrados, incluindo o preventDefault()
, que faz exatamente o que ele diz - pára o evento padrão de um elemento. Aqui, impedimos que a tag âncora atue como um link:
<a id="myLink" href="www.google.com">Link to Google</a>
$("#myLink").click(function (event) {
event.preventDefault();
});
Mais maneiras de jogar com o método de clique
A função de manipulador também pode aceitar dados adicionais na forma de um objeto:
jqueryElement.click(usefulInfo, handler)
Os dados podem ser de qualquer tipo.
$("element").click({firstWord: "Hello", secondWord: "World"}, function(event){
alert(event.data.firstWord);
alert(event.data.secondWord);
});
Invocar o método de clique sem uma função de manipulador aciona um evento de clique:
$("#alert").click(function () {
alert("Hi! I'm an alert");
});
$("#alert").click();
Agora, sempre que a página for carregada, o evento de clique será acionado quando inserirmos ou recarregarmos a página e mostrarmos o alerta atribuído.
Além disso, você deve preferir usar .on ('click',…) sobre .click (…) porque o primeiro pode usar menos memória e trabalhar para elementos adicionados dinamicamente.
Erros comuns
O evento click só é vinculado a elementos atualmente no DOM no momento da vinculação, portanto, todos os elementos adicionados posteriormente não serão vinculados. Para ligar todos elementos no DOM, mesmo se forem criados mais tarde, use o método .on()
.
Por exemplo, este exemplo de método de clique:
$( "element" ).click(function() {
alert("I've been clicked!");
});
Pode ser alterado para isso no exemplo do método:
$( document ).on("click", "element", function() {
alert("I've been clicked!");
});
Mais Informações:
Para mais informações, por favor visite o site oficial .