2011-01-03 10 views
44

これは他のいくつかの類似した複製ですが、この場合はevent.preventDefault()を正しく使用していると思います。 [送信]ボタンをクリックして、基本的にhttp://jsfiddle.net/SeEw2/2/jQuery event.preventDefault()がFirefoxで動作しない(JSFiddleが含まれています)

ここJSFiddleは、あなたがして、コードを見ることができます。

クロム:何も起こりません - 正解です。

Firefoxの場合:ページがリロードされました。

なぜFirefoxではページがリロードされ、Chromeでは表示されませんか?私はそれをFirebuggingしていて、どちらのエラーも出ません。

+14

これはChromeがChromeで動作する理由は、Chromeがハンドラをトリガする前に現在のイベントで 'window.event'を設定してIE依存のサイトにボーンを投げるということです。(そして、あなたの 'event'のような無料のリファレンスは - あなたのイベントハンドラシグネチャにそれを含めるのを忘れていたので、[ClemDesmが最初に指摘したように](http://stackoverflow.com/questions/4585970/jquery-event -preventdefault-not-working-in-firefox-jsfiddle-included/4586007#4586007) - あなたが 'window.event'に落ちていることを意味します。)FirefoxはIE特有のコードにそのような骨を投げません。 –

+0

非常に有益な、感謝T.J. - 私はそれを知らなかった。 – Jack

+2

jsFiddleではなく、質問にコードを投稿してください。 –

答えて

90

あなたのコードの変数eventは初期化されていません。

http://jsfiddle.net/SeEw2/4/

エキス:

$('#ajaxsearch').click(function(event) { 

     // Stop the Search input reloading the page by preventing its default action 
     event.preventDefault(); 
+0

Aha! ClemDesmさん、ありがとうございました。とにかくFirebugのエラーコンソールでまっすぐに表示されているようだ... hmmm :) – Jack

+7

なぜそれがクロムで動作するのだろうか...同じ正確な問題があってこれが修正された。 –

+0

@Shikiryu:あなたは私の一日を救った....ありがとう〜: – Pankaj

1

あなたがfunction(event)のようなイベントオブジェクトを渡していないので、しかし、あなたがtype="button"を作成し、onclickの値を渡すことができたときにも、このすべてを通過し、なぜ私の質問はありますか?本質的には、あなたがこのプロセス全体で何をしているのか。

+0

ねえ、なぜ私はそれを考えなかったのですか?乾杯!私は今、 'type =" button "'で動いています。私は 'onclick'を使っていませんが、もっと広い範囲では、このようにする方が便利です。 – Jack

+0

私は間違っているかもしれません(それは質問と関係がありません)が、私は疑問に思っています: 'type =" button "' _enter_キーボードタッチをサブミットとして認識していますか? jsfiddleで実際にテストすることはできません。別の方法でテストすることはできません@私の仕事と私は不思議です:) – Shikiryu

+0

テキストボックスにフォーカスを置いてEnterキーを押すと、入力しません。しかし、ボタン(おそらくTabbed)をフォーカスに合わせてEnterキーを押すと、それが送信として認識され、 'preventDefault()'が発生します。それはあなたが意味することですか? :) – Jack

8

ああ私は過去に同様の問題を抱えていました。むしろevent.preventDefault()にイベントを渡してみてくださいより:

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

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

私はそれはIE言うけど、私は=以来、それに問題を抱えていたことがありません]

+0

素敵なトリック!これを共有してくれてありがとう: –

1

代わりのクリックイベントを探して送信ボタンで$(form).submitハンドラを使用してみませんか?

ハンドラーの最後に「return false」がある限り、ページはリロードされません。

+0

これは私が今使っていることです。ありがとう! – Jack

0

私はこの方法で解決しました。私のコードが少し違うので、これは他の人に役立つかもしれません。私の最初のコードはこのように見えました。

<form id="enrollstudentform" onsubmit="return enrollStudents()"> 
    ... 
</form> 

私のJS関数は

function enrollStudents() { 
    // Stop Form. 
    event.preventDefault(); 
    // Other code 
} 

のように見えた私は、に持っていた関数呼び出しのパラメータイベントを渡し、機能でそれを受け取ります。

<form id="enrollstudentform" onsubmit="return enrollStudents(event)"> 
    ... 
</form> 

JSコード:

function enrollStudents(event) { 
    // Stop Form. 
    event.preventDefault(); 
    // Other code 
} 

私はそれが役に立てば幸い。

関連する問題