A função event.preventDefault () não está funcionando no IE

202

A seguir está o meu código JavaScript (mootools):

$('orderNowForm').addEvent('submit', function (event) {
    event.preventDefault();
    allFilled = false;
    $$(".required").each(function (inp) {
        if (inp.getValue() != '') {
            allFilled = true;
        }
    });

    if (!allFilled) {
        $$(".errormsg").setStyle('display', '');
        return;
    } else {
        $$('.defaultText').each(function (input) {
            if (input.getValue() == input.getAttribute('title')) {
                input.setAttribute('value', '');
            }
        });
    }

    this.send({
        onSuccess: function () {
            $('page_1_table').setStyle('display', 'none');
            $('page_2_table').setStyle('display', 'none');
            $('page_3_table').setStyle('display', '');
        }
    });
});

Em todos os navegadores, exceto no IE, isso funciona bem. Mas no IE, isso causa um erro. Eu tenho o IE8 e, ao usar seu depurador JavaScript, descobri que o eventobjeto não possui um preventDefaultmétodo que está causando o erro e, portanto, o formulário está sendo enviado. O método é suportado no caso do Firefox (que eu descobri usando o Firebug).

Qualquer ajuda?

sv_in
fonte
Faz; de acordo com os documentos ( mootools.net/docs/core/Native/Event#Event:preventDefault ), o que ele deve funcionar: "Método do evento: preventDefault - método de navegador cruzado para impedir a ação padrão do evento."
Paolo Bergantino
Meu erro, eu apaguei meu comentário, que era "o mootools não tem um método para interromper eventos?". Portanto, há um problema com mootools no IE8 ...
Alsciende
2
Não é possível reproduzir este problema. Este violino "funciona para mim em 8". Você pode configurar um violino reduzido para mostrar o erro? jsfiddle.net
eerne 24/05

Respostas:

472

no IE, você pode usar

event.returnValue = false;

para alcançar o mesmo resultado.

E para não obter um erro, você pode testar a existência de preventDefault:

if(event.preventDefault) event.preventDefault();

Você pode combinar os dois com:

event.preventDefault ? event.preventDefault() : (event.returnValue = false);
Alsciende
fonte
48
O código a seguir funcionou para mim: if (event.preventDefault) {event.preventDefault (); } else {event.returnValue = false; }
sv_in 16/06/09
229
event.preventDefault ? event.preventDefault() : event.returnValue = false;
mortiy
31
Vale ressaltar que "evento" deve ser o objeto de evento global no IE8. Você não pode usar o evento passado para o manipulador de eventos, como e.preventDefault, ele deve ser event.preventDefault para que isso funcione no IE8.
precisa saber é o seguinte
event.preventDefault();parou de trabalhar para mim no FireFox por algum motivo, do nada. Utilizou o código da moralidade e funcionou muito bem. Obrigado ~
James
8
Só para adicionar um pouco de clareza ao comentário de @ jmort253:$('.something').click(function(e){ e.preventDefault ? e.preventDefault() : event.returnValue = false; });
Luke
23

Se você vincular o evento através da função addEvent do mootools, seu manipulador de eventos receberá um evento fixo (aumentado) passado como parâmetro. Ele sempre conterá o método preventDefault ().

Experimente este violino para ver a diferença na associação de eventos. http://jsfiddle.net/pFqrY/8/

// preventDefault always works
$("mootoolsbutton").addEvent('click', function(event) {
 alert(typeof(event.preventDefault));
});

// preventDefault missing in IE
<button
  id="htmlbutton"
  onclick="alert(typeof(event.preventDefault));">
  button</button>

Para todos os usuários do jQuery , você pode corrigir um evento quando necessário. Digamos que você tenha usado o HTML onclick = ".." e obtenha um evento específico do IE que não contenha preventDefault (), basta usar esse código para obtê-lo.

e = $.event.fix(e);

Depois disso e.preventDefault (); funciona bem.

oldwizard
fonte
2
Infelizmente esse truque não está funcionando para mim. Estou usando o IE 10 e antes de chamar e.preventDefault (); Eu chamo $ .event.fix (e); sem sucesso :(
Beatles1692
Pode ter sido removido do jquery 2? Mas o IE10 não precisa da correção.
oldwizard
Você atribuiu o evento fixo à variável e novamente?
oldwizard
11

Eu sei que este é um post antigo, mas passei algum tempo tentando fazer esse trabalho no IE8.

Parece que existem algumas diferenças nas versões do IE8 porque as soluções postadas aqui e em outros threads não funcionaram para mim.

Digamos que temos este código:

$('a').on('click', function(event) {
    event.preventDefault ? event.preventDefault() : event.returnValue = false;
});

No meu preventDefault()método IE8 existe por causa do jQuery, mas não está funcionando (provavelmente por causa do ponto abaixo), então isso falhará.

Mesmo se eu definir a returnValuepropriedade diretamente como false:

$('a').on('click', function(event) {
    event.returnValue = false;
    event.preventDefault();
});

Isso também não funcionará, porque acabei de definir algumas propriedades do objeto de evento personalizado do jQuery.

A única solução que funciona para mim é definir a propriedade returnValueda variável global event como esta:

$('a').on('click', function(event) {
    if (window.event) {
        window.event.returnValue = false;
    }
    event.preventDefault();
});

Apenas para facilitar para alguém que tentará convencer o IE8 a trabalhar. Espero que o IE8 morra horrivelmente em uma morte dolorosa em breve.

ATUALIZAR:

Como sv_in aponta, você pode usar event.originalEventpara obter o objeto de evento original e definir a returnValuepropriedade no objeto original. Mas ainda não testei no IE8.

muffir
fonte
1
Você também pode obter o objeto de evento do navegador original event.originalEvent. Mais informações: stackoverflow.com/a/16675056/22550
sv_in
6

O Mootools redefine preventDefault nos objetos Event. Portanto, seu código deve funcionar bem em todos os navegadores. Caso contrário, existe um problema com o suporte ie8 no mootools.

Você testou seu código em ie6 e / ou ie7?

O documento diz

Todo evento adicionado ao addEvent obtém o método mootools automaticamente, sem a necessidade de instanciar manualmente.

mas, caso contrário, convém tentar

new Event(event).preventDefault();
Alsciende
fonte
1
Ocorreu algum problema ao quebrar como este também no IE. Oh meu Deus! Por que o IE?
sv_in
Ela não quer interromper o evento, apenas impedir sua ação padrão.
Alsciende
5
if (e.preventDefault) {
    e.preventDefault();
} else {
    e.returnValue = false;
}

Testado no IE 9 e Chrome.

RolandoCC
fonte
2
Não funciona no IE 11 (e.preventDefault é uma função, embora não parece fazer qualquer coisa)
GreySage
4

Para desativar uma tecla do teclado após o IE9, use: e.preventDefault();

Para desativar uma tecla normal do teclado no IE7 / 8, use: e.returnValue = false;oureturn false;

Se você tentar desativar um atalho de teclado (com Ctrl, como Ctrl+F), precisará adicionar essas linhas:

try {
    e.keyCode = 0;
}catch (e) {}

Aqui está um exemplo completo apenas para o IE7 / 8:

document.attachEvent("onkeydown", function () {
    var e = window.event;

    //Ctrl+F or F3
    if (e.keyCode === 114 || (e.ctrlKey && e.keyCode === 70)) {
        //Prevent for Ctrl+...
        try {
            e.keyCode = 0;
        }catch (e) {}

        //prevent default (could also use e.returnValue = false;)
        return false;
    }
});

Referência: Como desativar os atalhos de teclado no IE7 / IE8

JBE
fonte
Você é o único respondedor a acertar a unha na cabeça. A única razão pela qual alguém aqui está falando sobre o IE inicial é que eles precisam de funcionalidade entre plataformas. "e.keyCode = 0;" matará qualquer ação padrão no início do IE.
www-0av-Com
3

Aqui está uma função que eu tenho testado com a compilação noturna do jquery 1.3.2 e do dia 18/09/2009. Deixe-me saber seus resultados com ele. Tudo corre bem nesse sentido no Safari, FF, Opera no OSX. É exclusivamente para corrigir um bug problemático do IE8 e pode ter resultados indesejados:

function ie8SafePreventEvent(e) {
    if (e.preventDefault) {
        e.preventDefault()
    } else {
        e.stop()
    };

    e.returnValue = false;
    e.stopPropagation();
}

Uso:

$('a').click(function (e) {
    // Execute code here
    ie8SafePreventEvent(e);
    return false;
})
Eliran Malka
fonte
1
Eu nunca vi esse stopmétodo antes e não consegui encontrá-lo no msdn. O que isso faz?
Oriol
1
.stop()lança uma exceção, porque não existe. Qualquer exceção terá o efeito desejado.
Jay Bazuzi
e por que você gostaria de lançar uma exceção? Quer dizer, se você quiser lançar uma exceção, você poderia simplesmente chamar e.preventDefault()porque ele iria lançar uma exceção de qualquer maneira ...
Matthias Burger
2

preventDefaulté um padrão generalizado; usar um adhoc toda vez que você desejar estar em conformidade com as versões antigas do IE é complicado, é melhor usar um polyfill:

if (typeof Event.prototype.preventDefault === 'undefined') {
    Event.prototype.preventDefault = function (e, callback) {
        this.returnValue = false;
    };
}

Isso modificará o protótipo do evento e adicionará esta função, um ótimo recurso do javascript / DOM em geral. Agora você pode usar e.preventDefaultsem problemas.

EliuX
fonte
0

return false no seu ouvinte deve funcionar em todos os navegadores.

$('orderNowForm').addEvent('submit', function () {
    // your code
    return false;
}
daemon1981
fonte
0

FWIW, caso alguém revise essa pergunta posteriormente, você também pode verificar o que está entregando à sua função de manipulador onKeyPress.

Eu encontrei esse erro quando passei onKeyPress por engano em vez de onKeyPress (evento).

Apenas mais uma coisa para verificar.

Kirby L. Wallace
fonte
0

Fui ajudado por um método com uma verificação de função. Este método funciona no IE8

if(typeof e.preventDefault == 'function'){
  e.preventDefault();
} else {
  e.returnValue = false;
}
Pablo
fonte