よろしくお願いします。
このビデオでは、これまで、さまざまな種類のイベントについて少し話したいと思いますが、これまでのところ、クリックイベントと、スコアキーパーアプリのテキスト入力または数値入力で使用した変更イベントが発生しました。
私はMを導入することから始めるつもりです。 B. A. イベント参照。
それは私がここにいるWebページです。
また、このWebページは、DOM APIによって認識されるすべてのさまざまなイベントへの参照です。
私たちが下にスクロールすると、そこにいくつあるかだけで驚くかもしれません。
そして、実際には、次の練習で、いくつのコードがあるのか​​を数えるだけで、短所のジオメトリを使用するという楽しい実践的な例があります。
だからあなたは何人あるかを数えようとしていますが、今はちょうど1トンがあることを知っています。ドラッグアンドドロップのようなものを常時使用する10個までの多分おそらく5〜ホバリングイベントのクリックイベントはキープレスイベントをダブルクリックすることもありますが、そうでない場合は、あまり使われないものが決して使用されません。
しかし、このWebページには、決して使用することのない非常に多くのイベントが存在することがわかります。
そして、このビデオでは、マウスを使って要素をホバリングするようなホバリングと関係がある特に2つのイベントに焦点を当てます。
そしてそれらはマウスオーバーとマウスアウトと呼ばれています。
だから私は単純なアプリケーションを持っています。私は新しいファイルでその年齢にするよう呼び出されています。私は定期的な定型文を追加するだけです。これは完全なTo
Doリストにはなりません。
私たちは新しいものを追加することはできませんし、3〜4人の味方を持つULを持つことになるでしょう。
物事を洗う猫は猫を食べるようなものです。私たちは犬を飼って救います。
だから私たちは3つのことをしており、それだけで今必要なのです。
そして私がしたいこと。
私はこれをブラウザで開くつもりです。
私はクリックすることができるようにしたいと思うし、それはアイテムを行うには灰色でなければならないかもしれないし、たぶんそれがそれを通る行を打つ。
しかし、私はまた、ホバーできるようにしたいと私は私がホバリングしているかを知りたい。
だから私はこれらのいずれかの上にカーソルを置くと、この素晴らしいユーザーのフィードバックを得る。
たぶんあなたはそれを色や太字に変更するだけで、それは緑色にすることによって開始され、これらのホバーイベントを使用して、あなたのユーザーのためにできる多くの素晴らしい効果があります。
だから私はファイルを作る必要があるのに、実際にjavascriptを書く前にこれを表示します。
だから私は新しいファイルを保存するつもりです。私はそれを呼び出すでしょう。
はい。
そして、いつものように私は警戒を繋げてここに戻って、下のスクリプトを追加しました。私たちの情報源は、デュースドットJに等しいです。 S. 私たちは救いやリフレッシュを行い、警告を発する。
それはそれが働いていることを意味します。
私が言及したその最初のイベントに行きましょう。私たちが最初にやるべきことは、操作する前に何かを選択することです。
だから私は最初の嘘にそれをやって始めます。
だから私は最初の味方のECOドキュメントを使用するつもりです。私はクエリセレクタを実行します。これはクエリセレクタをすべて実行しなかったので、これは私に最初の嘘を与えたことを思い出してから、イベントリスナーを追加します最初の味方へ
そこで、まずイベントリスナーを追加して、リスンしているイベントをマウスでクリックしないようにしました。
それからコールバック関数を与えます。
マウスオーバーが動作する方法は、何かの上にマウスを乗せるようになるとすぐに開始されます。
だから私がこの最後の同盟国と一緒に働いていたら、私の上にマウスを置いて、今、今、もう一人、今、そしてこの最初の人に火を付けるでしょう。
それはホバリングがいつ始まるかについてです。
最初はイベントリスナーのマウスオーバーを追加し、コールバックマウスの代わりにログを作成し、コンソールを開くと最初の同盟者にしか行かなかったことを記憶しています。そこでマウスオーバーします。
また、毎回連続して発砲しているわけではないことに注意することも重要です。
これ以上のことは、要素の上にカーソルを置くと実際に始まります。
それは、コールバックでコードが何であっても、常にロギングしていることを常に知っているわけではないので便利です。
最初にマウスオーバーすると発生します。
だから、単にロギングをキャンセルするのではなく、同盟国の色を変更しようとします。
緑にしましょう。
その上にマウスを置くと緑色に変わります。
だから私たちは最初の同盟のドットスタイルを行う必要があります。色は緑と同じです。私たちはリフレッシュを保存して、私は彼をもう少し大きくし、これをもう少し大きくして、
そして私が離れて行くと、それは私たちが望むものではない緑のままです。
これをホバー効果にしたいだけです。
だから私が味方に乗ると緑色に変わります。
しかし、私はそれを停止するときにそれは黒になることを実際に別のイベントが必要とそのイベントは私たちのホバーが終わったときに起動します。
だから我々はこの要素を残して、それはマウスと呼ばれるので、我々は最初に同じことをやろうとしている。
しかし、イベントLessnerマウスアウト。
そしてコールバック関数を呼び出すと、最初のフライスタイルの攻撃カラーを作成して黒に戻します。
ちょうどそのようにして、私たちがリフレッシュすれば、それは緑色になることがわかり、次にマウスが緑色の上に黒とマウスに戻ります。
だから今我々はホバリングしているものが基本的に選択されていることを示すこの小さなホバー効果を得る。
それでは、これをすべての単一の嘘のために働かせましょう。
それは我々がする必要があるいくつかの小さな変更です。
そして最初のものはすべての同盟国を選ぶ必要があるということです。
3つの同盟国とのリストを私たちに与えるので、遠い嘘であることが非常に変わることになるでしょう。
そして残念ながら、残念なことに、うまく行かないイベントリスナーだけでは、このことを行うことはできません。
forループを実行する必要があります。
私はそのリンクに嘘をつきません。
プラスプラス。
そして、うまくいけば、イベントを追加したり、ループの代わりに何かを操作したりして、イベントを追加するのが少し楽になり始めたら、それらのバンドルを選択してからループし、個別に何かをやります。
私は、いくつかのビデオを前に言ったように、本当に共通のパターンは本当に重要なので、私たちはそれに慣れ始める。
だからここの内部ではなく、まずはイベントリスナーを追加します。
私たちは、同盟国と協力して、私たちの個人味方に目を向けています。
そして、私はこのコードをコピーして、このコードに問題があります。
私はそれが動作することを意味しますが、私たちが望むように動作しません。
イベントリスナーを各同盟国に追加しています。
しかし、私たちがその上にマウスを乗せたとき、私たちは最初のアライ・ドット・スタイルの黒色を変えているだけです。
最初の嘘はもう定義されていないので、実際にはうまくいきません。
名前を変更しました。
しかし、それは私たちが望んでいたものではありません。
マウスオーバーイベントが発生したことを肩を並べた味方になることを願っています。
ですから、これを「これ」という言葉に変更することができます。
イベントリスナーの代わりにこのキーワードが、イベントがトリガーされたアイテムまたは要素を参照することを覚えておいてください。
だから、このスタイルは同じ色ですが、このコードをもう一度複製します。
しかし、マウスの代わりにマウスを出すと、グリーンに行く代わりに黒に戻り、その後これを取り除き、リフレッシュしてそこに行くことができます。
私たちは、ちょっとしたホバー効果を持っています。
彼らが最後に話すのは、これをもう少し完了させるためにクリックリスナーを追加することです。
だから私はイベントリスナーのクリックまたはコールバック関数を持っていたと思ったのと同じこと。
ここでやることはクラスを使うことです。
だからクラスを最初に追加するつもりです。
それは存在しませんが、私はこれがクラスリストを行い、トグルする開始クラスリストを切り替えると言うつもりです。
そして、私たちはクラスを完成と呼ぶだけです。
だから、私はこれらのうちの1つをクリックすることができ、グレーアウトして取り消し線効果を持たせる必要があります。
そして、クラスが定義されていないにもかかわらず、まだ追加されているので、コンソールを開いて、これらのうちの1つを調べてみましょう。
そして、実際にそれをクリックしてみましょう。最初のものを見るかクリックすることができます。緑色と黒色が色分けされています。
しかし、この最初のボタンをクリックすると、クラスが追加されたことがわかります。
それから、もう一度クリックして消えます。
だから今はクラスを定義するだけです。
それでは、今やってみましょう。
私は昇華して新しいファイルを作成し、これを保存するつもりです。それはC Sです。最初に行うのは、クラスの定義です。
そして、私はテキストデコレーションで行う取り消し線効果を与え、その線を設定し、不透明度を変更して不透明度を0にします。 5と保存します。
そして、もちろん、これをリンクして評価するか、彼と一緒にファイルを保存する必要があります。これは、Dueの巨大なタグのようなものです。保存することができます。
さあ、それを試してみましょう。
あなたはページをリフレッシュします。
私はホバー。
ですから、黒と緑の色を変える2つのイベントがあります。
そしてクリックすると、取り消し線効果が得られます。
そして、この線も通り抜​​ける。
私はいくつかの小さな変更がありますが、私たちがjavascriptファイルに戻った場合は、ここで手動で色を変更するのではなく、最初のものがあります。
それを緑と黒に変更する。
私は自分のクラスでそれをやる方がまだ良いと思う。
だから、私は新しいクラスを作るつもりです。私はこれを選択して呼ぶつもりです。それから、選択されたテキストや色が緑のようになるはずです。
そして、私たちはJavascriptで行くつもりです。
そして、私たちが望むすべての上にマウスを置くと、このクラスリストが選択されたと言えます。
そして、これは、私たちがJavaScriptを使って個々のスタイルを操作するのではなく、JavaScriptを使用してC
Sの一部をオンにすることができ、SASが実際にスタイリングを担当するという懸念の分離に戻ってきます。
だから私たちが上にマウスを置いたときに選択されたクラスを与え、私たちが出て行ったり、私たちが混乱したときに、このダムクラスリストを削除したり、リフレッシュを保存すれば、
私たちはクリックストライクをクリックします。
大丈夫。
リストには少ししかありません。
これはやや良い方法です。
機能的には同じように見えます。
スタイルを追加して調整するのではなく、クラスを使用する方が良い方法です。
だからここでまとめてみると、マウスオーバーとマウスが2つの新しいイベントを見た。
また、このキーワードを使用したループの代わりにイベントを設定する方法もいくつかあります