Depois de disparar um evt.preventDefault()
, como posso retomar as ações padrão novamente?
Depois de disparar um evt.preventDefault()
, como posso retomar as ações padrão novamente?
Respostas:
Conforme comentado por @Prescott, o oposto de:
evt.preventDefault();
Poderia ser:
Equivale essencialmente a 'fazer o padrão' , já que não o estamos impedindo.
Caso contrário, estou inclinado a apontar as respostas fornecidas por outros comentários e respostas:
Como desvincular um ouvinte que está chamando event.preventDefault () (usando jQuery)?
Como reativar event.preventDefault?
Observe que a segunda foi aceita com uma solução de exemplo, fornecida por redsquare (postada aqui para uma solução direta, caso ela não seja fechada como duplicada):
$('form').submit( function(ev) {
ev.preventDefault();
//later you decide you want to submit
$(this).unbind('submit').submit()
});
function(evt) {evt.preventDefault();}
e seu oposto
function(evt) {return true;}
Felicidades!
return true
: nothing.
Para processar um comando antes de continuar um link de um click
evento no jQuery:
Por exemplo: <a href="http://google.com/" class="myevent">Click me</a>
Impeça e siga com o jQuery:
$('a.myevent').click(function(event) {
event.preventDefault();
// Do my commands
if( myEventThingFirst() )
{
// then redirect to original location
window.location = this.href;
}
else
{
alert("Couldn't do my thing first");
}
});
Ou simplesmente corra window.location = this.href;
atrás dopreventDefault();
Eu tive que atrasar o envio de um formulário no jQuery para executar uma chamada assíncrona. Aqui está o código simplificado ...
$("$theform").submit(function(e) {
e.preventDefault();
var $this = $(this);
$.ajax('/path/to/script.php',
{
type: "POST",
data: { value: $("#input_control").val() }
}).done(function(response) {
$this.unbind('submit').submit();
});
});
event.preventDefault(); //or event.returnValue = false;
e seu oposto (padrão):
event.returnValue = true;
fonte: https://developer.mozilla.org/en-US/docs/Web/API/Event/returnValue
Eu sugeriria o seguinte padrão:
document.getElementById("foo").onsubmit = function(e) {
if (document.getElementById("test").value == "test") {
return true;
} else {
e.preventDefault();
}
}
<form id="foo">
<input id="test"/>
<input type="submit"/>
</form>
... a menos que esteja faltando alguma coisa.
Não existe um método oposto de event.preventDefault()
entender por que você primeiro precisa examinar o que event.preventDefault()
faz quando o chama.
Sob o capô, a funcionalidade para preventDefault está essencialmente chamando um retorno false, que interrompe qualquer execução adicional. Se você está familiarizado com as formas antigas de Javascript, era uma vez na moda usar return false para cancelar eventos em itens como envios de formulários e botões usando return true (antes do jQuery aparecer).
Como você provavelmente já deve ter trabalhado com base na simples explicação acima: o oposto de event.preventDefault()
nada é. Você simplesmente não impede o evento; por padrão, o navegador permitirá o evento se você não o estiver impedindo.
Veja abaixo uma explicação:
;(function($, window, document, undefined)) {
$(function() {
// By default deny the submit
var allowSubmit = false;
$("#someform").on("submit", function(event) {
if (!allowSubmit) {
event.preventDefault();
// Your code logic in here (maybe form validation or something)
// Then you set allowSubmit to true so this code is bypassed
allowSubmit = true;
}
});
});
})(jQuery, window, document);
No código acima, você notará que estamos verificando se allowSubmit é falso. Isso significa que impediremos o envio do formulário event.preventDefault
e, em seguida, faremos alguma lógica de validação. Se estivermos felizes, defina allowSubmit como true.
Este é realmente o único método eficaz de fazer o oposto de event.preventDefault()
- você também pode tentar remover eventos, o que essencialmente alcançaria a mesma coisa.
Aqui está algo útil ...
Primeiro, clicamos no link, executamos algum código e depois executamos a ação padrão. Isso será possível usando event.currentTarget Dê uma olhada. Aqui, tentaremos acessar o Google em uma nova guia, mas antes precisamos executar algum código.
<a href="https://www.google.com.br" target="_blank" id="link">Google</a>
<script type="text/javascript">
$(document).ready(function() {
$("#link").click(function(e) {
// Prevent default action
e.preventDefault();
// Here you'll put your code, what you want to execute before default action
alert(123);
// Prevent infinite loop
$(this).unbind('click');
// Execute default action
e.currentTarget.click();
});
});
</script>
Isto é o que eu costumava definir:
$("body").on('touchmove', function(e){
e.preventDefault();
});
E para desfazê-lo:
$("body").unbind("touchmove");
Nenhuma das soluções me ajudou aqui e fiz isso para resolver minha situação.
<a onclick="return clickEvent(event);" href="/contact-us">
E a função clickEvent()
,
function clickEvent(event) {
event.preventDefault();
// do your thing here
// remove the onclick event trigger and continue with the event
event.target.parentElement.onclick = null;
event.target.parentElement.click();
}
Suponho que o "oposto" seria simular um evento. Você poderia usar.createEvent()
Seguindo o exemplo da Mozilla:
function simulateClick() {
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window,
0, 0, 0, 0, 0, false, false, false, false, 0, null);
var cb = document.getElementById("checkbox");
var cancelled = !cb.dispatchEvent(evt);
if(cancelled) {
// A handler called preventDefault
alert("cancelled");
} else {
// None of the handlers called preventDefault
alert("not cancelled");
}
}
Ref: document.createEvent
O jQuery possui .trigger()
para que você possa disparar eventos em elementos - às vezes úteis.
$('#foo').bind('click', function() {
alert($(this).text());
});
$('#foo').trigger('click');
jquery on () poderia ser outra solução para isso. escpacialmente quando se trata do uso de espaços para nome .
jquery on () é apenas a maneira atual de vincular eventos (em vez de bind ()). off () é desvincular estes. e quando você usa um espaço para nome, você pode adicionar e remover vários eventos diferentes.
$( selector ).on("submit.my-namespace", function( event ) {
//prevent the event
event.preventDefault();
//cache the selector
var $this = $(this);
if ( my_condition_is_true ) {
//when 'my_condition_is_true' is met, the binding is removed and the event is triggered again.
$this.off("submit.my-namespace").trigger("submit");
}
});
agora, com o uso do namespace, você pode adicionar vários desses eventos e removê-los, dependendo de suas necessidades. Embora o envio não seja o melhor exemplo, isso pode ser útil com um clique ou pressionamento de tecla ou o que for ..
Esta não é uma resposta direta para a pergunta, mas pode ajudar alguém. O que quero dizer é que você chama apenas preventDefault () com base em algumas condições, pois não há sentido em ter um evento se você chamar preventDefault () para todos os casos. Portanto, ter condições e chamar preventDefault () apenas quando as condições satisfeitas funcionarão da maneira usual para os outros casos.
$('.btnEdit').click(function(e) {
var status = $(this).closest('tr').find('td').eq(3).html().trim();
var tripId = $(this).attr('tripId');
if (status == 'Completed') {
e.preventDefault();
alert("You can't edit completed reservations");
} else if (tripId != '') {
e.preventDefault();
alert("You can't edit a reservation which is already attached to a trip");
}
//else it will continue as usual
});
você pode usar isso após o método "preventDefault"
// Aqui evt.target retorna o evento padrão (por exemplo: defult url etc)
var defaultEvent=evt.target;
// Aqui salvamos o evento padrão ..
if("true")
{
//activate default event..
location.href(defaultEvent);
}
esse código funcionou para eu re-instanciar o evento após o uso:
event.preventDefault(); to disable the event.
event.preventDefault = false;
Eu usei o seguinte código. Isso funciona bem para mim.
$('a').bind('click', function(e) {
e.stopPropagation();
});
event.preventDefault()
;