web-dev-qa-db-ja.com

event.preventDefault()関数がIEで機能しない

以下は私の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', '');
        }
    });
});

IEを除くすべてのブラウザーで、これは正常に機能します。しかし、IEでは、これによりエラーが発生します。 IE8を使用しているため、JavaScriptデバッガーを使用しているときに、eventオブジェクトにpreventDefaultメソッドがないため、エラーが発生しているため、フォームが送信されています。このメソッドは、Firefoxの場合にサポートされています(Firebugを使用して見つけました)。

ヘルプはありますか?

199
sv_in

iEでは、次を使用できます。

event.returnValue = false;

同じ結果を達成するために。

エラーが発生しないようにするには、preventDefaultの存在をテストできます。

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

この2つを以下と組み合わせることができます。

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

MootoolsのaddEvent関数を使用してイベントをバインドすると、イベントハンドラーはパラメーターとして渡された固定(拡張)イベントを取得します。常にpreventDefault()メソッドが含まれます。

このフィドルを試して、イベントバインディングの違いを確認してください。 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>

すべてのjQueryユーザーについては、必要に応じてイベントを修正できます。 HTML onclick = ".."を使用し、preventDefault()を持たないIE固有のイベントを取得した場合、このコードを使用して取得します。

e = $.event.fix(e);

その後、e.preventDefault();正常に動作します。

23
oldwizard

これは非常に古い投稿であることは知っていますが、IE8でこの作業を行うために少し時間を費やしました。

ここと他のスレッドで投稿されたソリューションが私にとってはうまくいかなかったため、IE8バージョンにはいくつかの違いがあるようです。

このコードがあるとしましょう:

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

IE8では、jQueryが原因でpreventDefault()メソッドが存在しますが、機能していない(おそらく以下の点が原因)ため、これは失敗します。

returnValueプロパティを直接falseに設定しても:

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

JQueryカスタムイベントオブジェクトのプロパティを設定しただけなので、これも機能しません。

私のために働く唯一の解決策は、グローバル変数returnValueのプロパティeventを設定することです:

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

IE8が動作するように説得しようとする人が簡単にできるようにするためです。 IE8が痛みを伴う死ですぐに死ぬことを願っています。

UPDATE:

sv_in が指摘しているように、event.originalEventを使用して元のイベントオブジェクトを取得し、元のオブジェクトにreturnValueプロパティを設定できます。しかし、IE8ではまだテストしていません。

11
muffir

Mootoolsは、EventオブジェクトのpreventDefaultを再定義します。したがって、コードはすべてのブラウザーで正常に動作するはずです。そうでない場合は、mootoolsのIE8サポートに問題があります。

Ie6および/またはie7でコードをテストしましたか?

ドキュメントは言う

AddEventで追加されたすべてのイベントは、手動でインスタンス化する必要なく、mootoolsメソッドを自動的に取得します。

しかし、そうでない場合は、試してみたいかもしれません

new Event(event).preventDefault();
6
Alsciende
if (e.preventDefault) {
    e.preventDefault();
} else {
    e.returnValue = false;
}

IE 9およびChromeでテスト済み。

4
RolandoCC

IE9の後にキーボードキーを無効にするには、e.preventDefault();を使用します

IE7/8で通常のキーボードキーを無効にするには、e.returnValue = false;またはreturn false;を使用します

キーボードショートカットを無効にしようとする場合(Ctrl+FのようなCtrlを使用)、これらの行を追加する必要があります:

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

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

参照: IE7/IE8でキーボードショートカットを無効にする方法

3
JBE

Jquery 1.3.2と2009-18-09のナイトリービルドでテストしてきた関数を次に示します。結果をお知らせください。 OSXのOperaのSafariでは、この目的ですべてが正常に実行されます問題のあるIE8バグを修正するためだけのものであり、意図しない結果になる可能性があります。

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

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

使用法:

$('a').click(function (e) {
    // Execute code here
    ie8SafePreventEvent(e);
    return false;
})
2
user175353

preventDefaultは広く普及している標準です。古いIEバージョンに準拠するたびにアドホックを使用するのは面倒で、ポリフィルを使用する方が適切です。

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

これにより、イベントのプロトタイプが変更され、この関数が追加されます。これは、一般的なjavascript/DOMの優れた機能です。これで、e.preventDefaultを問題なく使用できます。

2
EliuX

リスナーのreturn falseは、すべてのブラウザーで機能するはずです。

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

FWIWは、誰かが後でこの質問を再訪する場合に備えて、onKeyPressハンドラー関数に何を渡しているかを確認することもできます。

OnKeyPress(event)ではなくonKeyPress(this)を誤って渡したときに、このエラーに遭遇しました。

確認するために何か他のもの。

0

機能チェック付きの方法に助けられました。この方法はIE8で機能します

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