La funzione event.preventDefault () non funziona in IE

Di seguito è riportato il mio codice 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', '');
        }
    });
});

In tutti i browser tranne IE, questo funziona bene. Ma in IE, questo provoca un errore. Ho IE8 quindi mentre usando il suo debugger JavaScript, ho scoperto che l' eventoggetto non ha un preventDefaultmetodo che causa l'errore e quindi il modulo viene inviato. Il metodo è supportato in caso di Firefox (che ho scoperto usando Firebug).

Qualsiasi aiuto?

in IE, puoi usare

event.returnValue = false;

per ottenere lo stesso risultato.

E per non ottenere un errore, puoi verificare l'esistenza di preventDefault:

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

Puoi combinare i due con:

event.preventDefault ? event.preventDefault() : (event.returnValue = false);

Se si associa l'evento tramite la funzione addEvent di mootools, il gestore eventi riceverà un evento fisso (aumentato) come parametro. Conterrà sempre il metodo preventDefault ().

Prova questo violino per vedere la differenza nell'associazione di eventi. 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>

Per tutti gli utenti di jQuery , è possibile correggere un evento quando necessario. Supponi di aver usato HTML onclick = ".." e di ottenere un evento specifico di IE in cui manca preventDefault (), basta usare questo codice per ottenerlo.

e = $.event.fix(e);

Dopodiché e.preventDefault (); funziona bene.

So che questo è un post piuttosto vecchio ma ho appena trascorso un po 'di tempo a provare a farlo funzionare in IE8.

Sembra che ci siano alcune differenze nelle versioni di IE8 perché le soluzioni pubblicate qui e in altri thread non hanno funzionato per me.

Diciamo che abbiamo questo codice:

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

Nel mio preventDefault()metodo IE8 esiste a causa di jQuery, ma non funziona (probabilmente a causa del punto seguente), quindi questo fallirà.

Anche se ho impostato la returnValueproprietà direttamente su false:

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

Anche questo non funzionerà, perché ho appena impostato alcune proprietà dell'oggetto evento personalizzato jQuery.

L'unica soluzione che funziona per me è impostare la proprietà returnValuedella variabile globale in event questo modo:

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

Solo per rendere più facile per qualcuno che cercherà di convincere IE8 a lavorare. Spero che IE8 morirà presto orribilmente in una morte dolorosa.

AGGIORNARE:

Come sv_in sottolinea, è possibile utilizzare event.originalEventper ottenere l'oggetto evento originale e impostare la returnValueproprietà in quello originale. Ma non l'ho ancora testato su IE8.

Mootools ridefinisce preventDefault negli oggetti Event. Quindi il tuo codice dovrebbe funzionare bene su ogni browser. In caso contrario, c'è un problema con il supporto ie8 nei mootools.

Hai testato il tuo codice su ie6 e / o ie7?

Il doc dice

Ogni evento aggiunto con addEvent ottiene automaticamente il metodo mootools, senza la necessità di istanziarlo manualmente.

ma in caso contrario, potresti provare

new Event(event).preventDefault();

if (e.preventDefault) {
    e.preventDefault();
} else {
    e.returnValue = false;
}

Testato su IE 9 e Chrome.

Per disabilitare un tasto della tastiera dopo IE9, utilizzare: e.preventDefault();

Per disabilitare un normale tasto della tastiera in IE7 / 8, utilizzare: e.returnValue = false;oreturn false;

Se provi a disabilitare una scorciatoia da tastiera (con Ctrl, come Ctrl+F), devi aggiungere quelle righe:

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

Ecco un esempio completo solo per 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;
    }
});

Riferimento: come disabilitare le scorciatoie da tastiera in IE7 / IE8

Ecco una funzione che ho testato con la build notturna di jquery 1.3.2 e 09-18-2009. Fammi sapere i tuoi risultati con esso. Tutto funziona bene in questo senso in Safari, FF, Opera su OSX. Serve esclusivamente per correggere un bug IE8 problematico e può avere risultati indesiderati:

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;
})

preventDefaultè uno standard diffuso; usare un ad hoc ogni volta che vuoi essere conforme alle vecchie versioni di IE è complicato, meglio usare un polyfill:

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

Questo modificherà il prototipo dell'evento e aggiungerà questa funzione, una grande caratteristica di javascript / DOM in generale. Ora puoi usarlo e.preventDefaultsenza problemi.

return false nel tuo listener dovrebbe funzionare in tutti i browser.

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

FWIW, nel caso in cui qualcuno riesca a rivedere questa domanda in un secondo momento, potresti anche controllare cosa stai passando alla tua funzione di gestore onKeyPress.

Ho riscontrato questo errore quando ho erroneamente passato su KeyPress (questo) anziché su KeyKey (evento).

Solo qualcos'altro da controllare.

Sono stato aiutato da un metodo con un controllo funzionale. Questo metodo funziona in IE8

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