2012-04-12 14 views
1

私は数分前にいくつかのコードを探していましたが、これは私を混乱させます。このコードはどのように機能しますか?

$("nav a").mouseenter(function() { 
    audio.play(); 
}); 

「$」はdocument.getElementById( "")のjQueryです。 mouseEnterは 'nav a'のイベントハンドラですが、どのように関数がイベントに割り当てられていますか?代入演算子 '='はありませんか?

私はJavaScriptを完全にダウンしようとしているので、今はjQueryについてよく分かりません。だから、純粋なJavaScriptになるようにコードを修正すると、うまく動作しないようです...

document.getElementById("playAudio").onclick(function() { 
    audio.play(); 
}); 

私はなぜそれほど理解できませんか? ...

答えて

0

(関数式で作成された)関数オブジェクトをjQuery.mouseenterに渡していて、そこからjQueryが取り出します。

ここでは、DOM(Document Object Model)をご紹介します。あなたはコードを純粋なJavaScript + DOM APIにしようとしています。 JSとDOMの両方の基本を学ぶのは良いことですが、jQueryはブラウザのイベントリスナーの登録など、DOMの実装における多くの不一致を解消することに注意してください。

+0

私はJSとDOMの基本を打ち破った後、確実にjQueryを学びたいと思っています。多くの人がjQueryに移行しているため、この日の基礎を学ぶのは難しいです。私は彼らを非難することはできません、その素晴らしいツールです。 – W3Geek

0

関数は渡され、関数は匿名です(名前はありません)。あなたも行うことができ

function foo() { audio.play(); } 

$('nav a').mouseenter(foo); 
0

ドル記号がちょうどgetElementById()に限定されるものではなく、それjQueryオブジェクトとあなたのケースでは、navaタグをつかんで、その後nav要素を呼んでいます。要素を取得した後、イベントを匿名でアタッチし、イベントが発生するたびに関数を実行できるようにします。

+0

うーん、私はjQueryについてたくさん知りません。私は、JavaScriptを使ってほとんどのことを学ぶまではjQueryを使いこなすことに満足しています。コードを純粋なJavaScriptに変更すると、動作しないようです... – W3Geek

+0

onclick()およびmouseenter()イベントは、セレクタを介して接続されたjQuery関数です。通常のJavaScriptでは、イベントを少し異なるものにする必要があります。次のようなものです: 'document.getElementById(" playAudio ")。onclick = function(){audio.play();};'。構文の詳細については、[jQueryウェブサイト](http://www.jquery.com)を参照してください。 – faino

+0

私はそこを見ましたが、私はそれについてどこで読むべきかわかりません。非常に多くのドキュメント! jQueryを掘り下げる前に、JavaScriptを十分に理解したいと思っています。残念ながら多くの人がjQueryに移行しているので、定期的なJavaScriptを学ぶのが難しくなっています。したがって、正規のJSでは、 '='記号で割り当て、jQueryではイベントに関数を割り当てるために '='記号を使用する必要はありません。 – W3Geek

1

mouseenterは関数です。類似している:

var element = {elm: document.getElementById('test')}; 
element.mouseenter = function(func) { 
    element['elm'].addEventListener('mouseenter', func); 
}; 
element.mouseenter(function() {}); 
関連する問題