HTMLフォーム入力監視の詳細な理解

HTMLフォーム入力監視の詳細な理解

今日、入力イベントに関するブログ投稿を見て、気まぐれで関連情報を整理してみました。

イベント:

関数 changeVal(値){ console.log($(値).val())}

onchange: onchange イベントは、前のコンテンツと次のコンテンツが変更されてフォーカスが失われた場合にのみトリガーされます。

 <input type="text" value="" onchange="changeVal(this)">

oninput: 値が変更されると、oninput イベントがトリガーされます。

 <input type="text" value="" oninput="changeVal(this)">

oninput と同様の効果を持つ onpropertychange イベントもありますが、これは IE に固有のものです。そして、テストしたところうまくいかなかったので、私は完全に混乱しました。 。 。

補充:

oninput と onpropertychange が失敗するケース:

oninput イベント:

(1)スクリプト内で値が変更されても、トリガーされません。

(2)ブラウザの自動ドロップダウンプロンプトから選択した場合にはトリガーされません。

onpropertychange イベント:

入力がdisable=trueに設定されている場合、入力はトリガーされません。

以上が、エディターがお届けするHTMLフォーム入力監視の詳細な内容です。気に入っていただければ幸いです。

ゲーム活動やゲーム戦略についてもっと知りたい場合は、引き続きこのサイトに注目してください。このサイトの編集者は、できるだけ早く最高で、最も楽しく、最も新鮮なゲーム情報をお届けします。さらにエキサイティングなコンテンツをお楽しみいただくには、jb51 ゲーム チャンネルにアクセスしてください。

<<:  nginx proxy_pass 設定で URL が / で終わる場合と / なしで終わる場合の違いの詳細な説明

>>:  MySQL テーブルスペースとは何ですか?

推薦する

WeChatアプレットのスクロールビューが左右にスライドできない問題を解決する方法

私は現在、自分自身の小さなプログラム プロジェクトに取り組んでいます。プロフェッショナルなフロントエ...

ブラウザの自動フォーム入力によるウェブページのスタイル損失の原因の分析と解決

バックエンドからフロントエンドまで、なんと悲劇なのでしょう。他の人の CSS を自分の jsp We...

コマンドを使用してMySQLデータベース(de1)を作成する方法

1. MYSQLに接続するフォーマット: mysql -h ホストアドレス -u ユーザー名 -p ...

2 つの Linux サーバー間の自動ファイル同期

サーバーB(172.17.166.11)の電源がオンまたは再起動されると、サーバーA(172.17....

MySQL テーブルを返すとインデックスが無効になるケースの説明

導入MySQL InnoDB エンジンがレコードをクエリし、インデックス カバレッジを使用できない場...

CentOS7でルートパスワードをリセットする方法

レンガを移動するプロセスでは、さまざまな環境および構成の問題があり、毎回異なるエラーが発生します。 ...

Vue エクスポート Excel 機能の全プロセス記録

目次1. フロントエンドのリーディングプロセス: 2. プラグインの使用と初期化2.1 vue-ad...

Ubuntu 20.04 に MySql5.7 をインストールして構成するための詳細なチュートリアル

目次1. Ubuntuソースの変更2. MySQLをインストールする3. 新しいユーザーを作成し、権...

node.js が大規模プロジェクトに適さない理由

目次序文1. アプリケーションコンポーネント2. アプリケーションの種類3. アプリケーションサービ...

Dockerイメージの作成、アップロード、プル、デプロイを理解するための記事

目次1. 画像1. 鏡とは何ですか? 2. 画像の構成と目的(1) Dockerファイル(2)スクラ...

Linux でのマルチスレッドおよびマルチプロセス クラッシュのシミュレーションに関する簡単な説明

結論:マルチスレッド環境では、スレッドの 1 つがクラッシュすると、他のスレッド (プロセス全体) ...

moment.jsの時間と日付の処理の詳細な説明

月曜日から日曜日の時間形式の変換(Y --- 年 M --- 月 D--- 日) : : : : :...

HTML テーブルの空白セル補完を実装する方法

私が初めて Web 開発を独学で学んだ頃は、いわゆる DIV/CSS レイアウトはなく、テーブル レ...

プロトタイプとプロトタイプチェーン プロトタイプとプロトタイプの詳細

目次1. プロトタイプ2. プロトタイプチェーン2.1 コンストラクタ2.2 電話をかける/申し込む...

ネイティブ js が携帯電話のプルダウン更新を模倣

この記事では、携帯電話のプルダウンリフレッシュを模倣したjsの具体的なコードを参考までに共有します。...