jQueryの/ JavaScriptを - Firefoxの

Question

上event.target.idは私がChromeで正常に動作します書かれた短いスクリプトを持っている：

function updateSentence(){ 
    $(document).ready(function() { 
     t = event.target.id; 
     $("#S"+t).html($("#"+t).val()); 
    }); 
} 

しかし、Firefoxのイベントで定義されていません。私は、イベントが関数にパラメータとして渡される必要があることが示唆されたいくつかの同様の質問見つけた：私にとっては、

function updateSentence(event){ 
    $(document).ready(function(event) { 
     t = event.target.id; 
     $("#S"+t).html($("#"+t).val()); 
    }); 
} 

はまだありませんFirefoxの問題を解決し、それは実際にそれがどのように動作するか壊れていない、このソリューションChromeでChromeでは、これらが渡されたときにevent.targetが定義されていないという結論に達します。

私は間違っていますか？

私はいくつかのコメントを受け取った後、私が一般的にjQueryについて考える方法が間違っていたことに気付きました。私は$(document).readyが文章の更新ごとに呼ばれることを望まなかった。私がなってしまったこの知識と機能のクリーンアップ：これはまだ正しくChromeで文を更新し、まだ

function updateSentence(){ 
    t = event.target.id; 
    $("#S"+t).html($("#"+t).val()); 
} 

targetは、Firefoxで未定義され続けています。 Firefoxでこれを動作させるには、私は何をする必要がありますか？そして、私はまだjQueryで根本的に何かをやっていますか？

また、コメント内の質問に答えるために、私が探しているイベントは、updateSentence()を引き起こしたonchangeイベントです。これは、選択/テキストフィールドが変更されたときに呼び出される必要があります。

（私はまだjQueryと一般的にはJavaScriptに新たなんだ、と私は、私はちょうど単純なミスを作ってるんだと確信している。）

---

私は私の答えを見つけました。私はサイトが私を許可するカップル時間で投稿します。

Answer 1

はい、非常に良好です。あなたがこれをやったことを再考すれば、それはより理にかなっています。 あなたのバインドをあなたの機能から分離してください。それは戦いの半分です。

$(function() { // Equivalent of Document Ready; You only need this once; 
    // BINDINGS HERE 
    $('someSelector').on('change keypress', function(event) { 
    updateSentence(this); 
    }); 
}); 

function updateSentence(elem) { 
    $('#S' + elem.id).html(elem.value) ; 
} 

また、これはセカンダリ機能を使用しないことを示唆しているケースの1つです。いくつかのケースでは、あなたがやりたいことは単純ですが、あなたがバインドしたこと以外の関数を呼び出すことを正当化するのは難しいでしょう。

$(function() { 
    $('someSelector').on('change keypress', function(event) { 
    $('#S' + this.id).html(this.value) ; 
    }); 
}); 

あなたはeventの必要性が回避されるこれらの例の両方に気づくでしょう。ただし、FFの場合でもn引数（function(event)）として渡されるため、FFでも使用できます。

FFのコードであなたの 'target'が定義されていないのは、FFがほとんどのブラウザのように空気のないeventをつかまえないからです。したがって、eventの必要性を排除するためにコードをセットアップできない場合、または私の例のようにコードを渡す場合は、window.eventで参照できます。

Answer 2

上記のコメントに記載されていることと私がもう少しやっていたことを読んだ後、私は私の質問に対する答えを見つけました。まず、関数が呼び出されるたびに$(document).ready呼び出しを誤って使用していました。次に、IDがどのように関数に渡されたかについての私の理解は間違っているようです。自動的に渡されるのではなく、手動で実行する必要があります。したがって、私の最初の混乱はなぜ他のコメント作成者が私の質問によって混乱したのかについてです。いずれにせよ、これらのことを知って、私は2つの他の答えられた質問の組み合わせで私の答えを見つけました。彼らは、これらの二つのスタックオーバーフローの質問に記載されています。

• Getting the ID of the element that fired an event

• JavaScript - onClick to get the ID of the clicked button

私はまだこの説明で間違った何かを言っていると確信しているが、私まもなく学ぶでしょう。