ホームページ >ウェブフロントエンド >jsチュートリアル >js でのクリック イベントと一般的に使用されるイベントの概要 (PC およびモバイル)
1. クリック イベント:
PC 側のクリック イベントですが、モバイル プロジェクトでは、クリックの動作とダブルクリックの動作を区別することがよくあります。したがって、モバイルブラウザは、クリックを識別するとき、クリックであることが確認された後にのみ実行されます。モバイル端末でクリックを使用する場合、300ミリ秒の遅延が発生します。最初のクリックが完了した後、ブラウザは待機する必要があります。 2 回目のクリックがトリガーされたかどうかを確認するために 300 ミリ秒。2 回目のクリックがトリガーされた場合はクリックに属しません。ただし、シナリオによってはこれが必要です。遅延をキャンセルするには:
(1) 静止ズーム: 目標を達成するには、この方法を使用してスケーリングを完全に無効にする必要があります。ほとんどのモバイル端末ではこの遅延の問題を解決できますが、一部の Apple 携帯電話ではまだ解決できません。 ; height - ビューポートの高さ、initial-scale - 最小スケール - ユーザーがズームできる最小比率、 user-scalable - ユーザーが手動でズームできるかどうか<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">(2) fastclick.js: FastClick は、モバイル ブラウジングを解決するために特別に設計された FT Labs です。300 ミリ秒のクリック遅延の問題を解決するために開発された軽量ライブラリです。つまり、FastClick はタッチエンド イベントを検出すると、DOM カスタム イベントを通じてシミュレートされたクリック イベントを即座にトリガーし、300 ミリ秒後にブラウザーによって実際にトリガーされるクリック イベントをブロックします。 ステップ 1: ページ上で fastclick を導入します。 jsファイル。 ステップ 2: 次のコードを js ファイルに追加します。ウィンドウの読み込みイベントの後、本文で FastClick.attach() を呼び出します。
window.addEventListener(function(){ FastClick.attach( document.body ); },false );
プロジェクトで JQuery を使用している場合は、上記のコードを次のように書き換えます:
$(function() { FastClick.attach(document.body); });モバイル側のクリック イベントを置き換えます:
機能
タッチスタート | 画面を指で押します |
---|---|
画面上で指をスワイプします | |
画面から指を離してください | |
特別な状況下で閉店/終了するときにトリガーされます | |
タッチイベントの属性: |
タイプ | イベントタイプ |
---|---|
イベントソース | |
デフォルトの動作をブロックする | |
事件の拡大を阻止してください | |
タッチ位置のx値 | |
現在値と左値 |
イベント名 | 機能 |
---|---|
クリック | マウスをクリックすると起動します |
マウスオーバー | マウスポインタが要素上を移動すると発生します |
マウスアウト | マウスポインタが要素の外に移動すると発生します |
マウスエンター | マウスポインタが要素上を移動するとトリガーされます(バブリングはサポートされていません) |
マウス離れる | マウスポインターが要素の外に移動するとトリガーされます (バブリングはサポートされていません) |
マウス移動 | マウスポインタが要素上を移動すると発生します |
マウスダウン | 要素上でマウスボタンが押されたときに発生します |
マウスアップ | 要素上でマウスボタンが離されたときに発生します |
マウスホイール | マウスホイールのスクロール時に実行されるスクリプト |
キーダウン | ユーザーがキーを押すと起動します |
キーアップ | ユーザーがキーを放したときに起動します |
ロード | ページの読み込みが完了した後にトリガーされます |
スクロール | 要素のスクロールバーがスクロールされたときに実行されるスクリプト |
ぼかし | 要素がフォーカスを失ったときに実行されるスクリプト |
集中 | 要素がフォーカスを取得したときに実行されるスクリプト |
変更 | 要素の値が変更されたときに実行されるスクリプト |
モバイル端末でよく利用されるイベント:
イベント名 | 機能 |
---|---|
クリック | クリックすると発火します(クリック) |
ロード | ページの読み込みが完了した後にトリガーされます |
スクロール | 要素のスクロールバーがスクロールされたときに実行されるスクリプト |
ぼかし | 要素がフォーカスを失ったときに実行されるスクリプト |
集中 | 要素がフォーカスを取得したときに実行されるスクリプト |
変更 | 要素の値が変更されたときに実行されるスクリプト |
入力 | キーアップとキーダウンを置き換えます |
タッチイベントモデル | 一本指操作の処理 |
ジェスチャーイベントモデル | 複数の指での操作の処理 |
以上がjs でのクリック イベントと一般的に使用されるイベントの概要 (PC およびモバイル)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。