検索
ホームページウェブフロントエンドjsチュートリアルjQuery テキスト ボックス (入力テキスト) イベント バインディング メソッドtutorial_jquery

現在 1.7 以降では、jquery のイベント バインディングが元のバインドを on に置き換えています。 次に、バインドと入力テキストのイベントの使用方法を紹介します。興味のある方は、

(1) を参照してください。 ) jquery binding events
現在 1.7 以降では、jquery のイベント バインディングは元のバインドを on に置き換えています。 違い: (個人的な理解) binding は各子ノードにバインドされているだけです。

使用法: バインド
1 つのイベント、1 つのメソッド: $(".class input").bind('click ',function(e){ ...;e.stopPropagation;})
2 つのイベント、1 つのメソッド: $(".class input").bind('click Mouseover',function(e){.. .;e.stopPropagation;})
2 つのイベント、2 つのメソッド: $(".class input").bind({ click:function(e){...;e.stopPropagation;}、mouseover: function(e){...;e .stopPropagation;} })
on では、bind を直接置き換えることができます。これは、上記の使用法が on に適用できることを意味します。
さらに、on には、bind 選択パラメータよりも 2 つのオプションがあります。
on( events [ , selector ] [, data ], handler(eventObject) )

selector: バインドされる要素。上記の例は $(".class") のように記述できます。 input',function(e){...;e.stopPropagation;})
('Shit' に固有の、使いにくいイベントがあることに注意してください。つまり、Event: onpropertychange;
使用可能: $(".class input").bind('propertychange',function(e){...;e.stopPropagation;})
応答なし: $(".class") .bind('propertychange','input',function(e){...;e.stopPropagation;})
)

data:event.data に渡されるパラメータ、$ (".class ").bind('click','input','123',function(e){alert(e.data/*123*/);e.stopPropagation;})
(より具体的な使用法については、マニュアル http://api.jquery.com/on/ を確認してください);


(2) テキスト ボックスのコンテンツのリアルタイム変更イベントを作成する前に、 を入力します。イベントがトリガーされる場合は、onkeyup onchange; を使用しますが、onchang はテキスト ボックスがフォーカスを外した後にのみトリガーされます。後で、
(IE の場合) onpropertychange else oninput で処理できることがわかりました。

注:
oninput イベントは、ユーザーが入力、バックスペース、削除、カット、ペースト、およびマウスのカット アンド ペーストを行ったときにトリガーされます (IE9 と IE9 では若干異なる場合があります)。
(Firefox、Chrome、IE9 および IE9 はすべてサポート)
onpropertychange イベントは、ユーザー入力、バックスペース、削除、カット、ペースト、マウスのカット アンド ペースト
(IE でのみサポート) のときにトリガーされます。


(3) 共通イベント oncut イベントは、オブジェクトがアクティブ要素として設定されている場合、貼り付け (ctrl v) またはマウス貼り付け時にトリガーされます。
onafterupdate は、データ ソース オブジェクト内の関連オブジェクトが正常に更新された後、データ バインディング オブジェクトに対してトリガーされます。
onbeforeactivate オブジェクトは、現在の要素に設定される直前にトリガーされます。
onbeforecut 選択した領域がドキュメントから削除される前に、ソース オブジェクトで起動されます。
onbeforedeactivate は、activeElement が現在のオブジェクトから親ドキュメント内の別のオブジェクトに変更される直前にトリガーされます。
onbeforeeditfocus は、編集可能要素に含まれるオブジェクトがユーザー インターフェイスのアクティブ化状態に入る前、または編集可能コンテナがコントロール選択領域になる前にトリガーされます。
onbeforepaste 選択内容がシステム クリップボードからドキュメントに貼り付けられる前に、ターゲット オブジェクトに対して起動されます。
onbeforeupdate は、データ ソース オブジェクト内の関連オブジェクトが正常に更新される前に、データ バインディング オブジェクトに対してトリガーされます。
onblur は、オブジェクトが入力フォーカスを失ったときにトリガーされます。
onchange オブジェクトまたは選択した領域のコンテンツが変更されたときにトリガーされます。
onclick は、ユーザーがマウスの左ボタンでオブジェクトをクリックするとトリガーされます。
oncontextmenu ユーザーがクライアント領域を右クリックしてコンテキスト メニューを開くと起動されます。
oncontrolselect ユーザーがオブジェクトのコントロール選択を作成しようとしているときに起動します。
oncut オブジェクトまたは選択範囲がドキュメントから削除され、システム クリップボードに追加されたときに、ソース要素で起動されます。
ondblclick ユーザーがオブジェクトをダブルクリックすると起動します。
ondeactivate は、activeElement が現在のオブジェクトから親ドキュメント内の別のオブジェクトに変更されるときにトリガーされます。
ondrag ドラッグ操作が実行されると、ソース オブジェクト上で継続的に起動されます。
ondragend ドラッグ操作が終了した後にユーザーがマウスを放したときに、ソース オブジェクトで起動されます。
ondragenter は、ユーザーがオブジェクトを正当なドラッグ ターゲットにドラッグすると、ターゲット要素でトリガーされます。
ondragleave は、ユーザーがドラッグ操作中にマウスを正当なドラッグ ターゲットの外に移動すると、ターゲット オブジェクトでトリガーされます。
ユーザーが正当なドラッグ ターゲットを越えてオブジェクトをドラッグすると、ターゲット要素で Ondragover が引き続きトリガーされます。
ondragstart ユーザーがテキスト選択領域または選択したオブジェクトのドラッグを開始すると、ソース オブジェクトで起動されます。
ondrop ドラッグ操作中にマウス ボタンが放されたときに、ターゲット オブジェクトで起動します。
onerrorupdate は、データ ソース オブジェクト内の関連データの更新中にエラーが発生したときに、データ バインディング オブジェクトでトリガーされます。
onfilterchange ビジュアル フィルターの状態が変更されるか、遷移が完了するときに発生します。
onfocus オブジェクトがフォーカスを取得したときに発生します。
onfocusin 要素がフォーカスに設定される前に起動します。
onfocusout は、フォーカスを他の要素に移動した直後に、現在フォーカスがある要素に対してトリガーされます。
onhelp ブラウザが現在のウィンドウであるときにユーザーが F1 キーを押すと起動します。
onkeydown ユーザーがキーボードのキーを押したときに起動します。
onkeypress ユーザーがリテラルキーを押したときに起動します。
onkeyup ユーザーがキーボードのキーを放したときに起動します。
onlosecapture オブジェクトがマウスのキャプチャを失ったときに起動します。
onmousedown ユーザーがマウス ボタンでオブジェクトをクリックすると起動します。
onmouseenter ユーザーがマウス ポインタをオブジェクト内に移動すると起動します。
onmouseleave ユーザーがマウス ポインタをオブジェクトの境界外に移動すると発生します。
onmousemove は、ユーザーがマウスをオブジェクト上に移動するとトリガーされます。
onmouseout ユーザーがマウス ポインタをオブジェクトの境界外に移動すると発生します。
onmouseover ユーザーがマウス ポインタをオブジェクト内に移動すると起動します。
onmouseup マウスがオブジェクト上にあるときにユーザーがマウス ボタンを放したときに起動します。
onmousewheel マウスのホイール ボタンが回転すると起動します。
onmove オブジェクトが移動すると発火します。
onmoveend オブジェクトの移動が停止したときに発生します。
onmovestart オブジェクトが移動を開始すると起動します。
onpaste ユーザーがデータを貼り付けてシステム クリップボードからドキュメントにデータを転送するときに、ターゲット オブジェクトで起動されます。
onpropertychange オブジェクトでプロパティの変更が発生したときに起動します。
onreadystatechange は、オブジェクトの状態が変化するとトリガーされます。
onresize オブジェクトのサイズが変更されようとしているときに起動します。
onresizeend は、ユーザーがコントロールの選択領域内のオブジェクトのサイズを変更するとトリガーされます。
onresizestart ユーザーがコントロールの選択領域内のオブジェクトのサイズを変更し始めると発生します。
onselect は、現在の選択が変更されるとトリガーされます。
onselectstart は、オブジェクトが選択されようとしているときにトリガーされます。
ontimeerror 特定の時間にエラーが発生した場合に無条件で起動します。通常はプロパティを無効な値に設定することが原因です。

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
ブラウザを超えて:現実世界のJavaScriptブラウザを超えて:現実世界のJavaScriptApr 12, 2025 am 12:06 AM

現実世界におけるJavaScriptのアプリケーションには、サーバー側のプログラミング、モバイルアプリケーション開発、モノのインターネット制御が含まれます。 2。モバイルアプリケーションの開発は、ReactNativeを通じて実行され、クロスプラットフォームの展開をサポートします。 3.ハードウェアの相互作用に適したJohnny-Fiveライブラリを介したIoTデバイス制御に使用されます。

next.jsを使用してマルチテナントSaaSアプリケーションを構築する(バックエンド統合)next.jsを使用してマルチテナントSaaSアプリケーションを構築する(バックエンド統合)Apr 11, 2025 am 08:23 AM

私はあなたの日常的な技術ツールを使用して機能的なマルチテナントSaaSアプリケーション(EDTECHアプリ)を作成しましたが、あなたは同じことをすることができます。 まず、マルチテナントSaaSアプリケーションとは何ですか? マルチテナントSaaSアプリケーションを使用すると、Singの複数の顧客にサービスを提供できます

next.jsを使用してマルチテナントSaaSアプリケーションを構築する方法(フロントエンド統合)next.jsを使用してマルチテナントSaaSアプリケーションを構築する方法(フロントエンド統合)Apr 11, 2025 am 08:22 AM

この記事では、許可によって保護されたバックエンドとのフロントエンド統合を示し、next.jsを使用して機能的なedtech SaaSアプリケーションを構築します。 FrontEndはユーザーのアクセス許可を取得してUIの可視性を制御し、APIリクエストがロールベースに付着することを保証します

JavaScript:Web言語の汎用性の調査JavaScript:Web言語の汎用性の調査Apr 11, 2025 am 12:01 AM

JavaScriptは、現代のWeb開発のコア言語であり、その多様性と柔軟性に広く使用されています。 1)フロントエンド開発:DOM操作と最新のフレームワーク(React、Vue.JS、Angularなど)を通じて、動的なWebページとシングルページアプリケーションを構築します。 2)サーバー側の開発:node.jsは、非ブロッキングI/Oモデルを使用して、高い並行性とリアルタイムアプリケーションを処理します。 3)モバイルおよびデスクトップアプリケーション開発:クロスプラットフォーム開発は、反応および電子を通じて実現され、開発効率を向上させます。

JavaScriptの進化:現在の傾向と将来の見通しJavaScriptの進化:現在の傾向と将来の見通しApr 10, 2025 am 09:33 AM

JavaScriptの最新トレンドには、TypeScriptの台頭、最新のフレームワークとライブラリの人気、WebAssemblyの適用が含まれます。将来の見通しは、より強力なタイプシステム、サーバー側のJavaScriptの開発、人工知能と機械学習の拡大、およびIoTおよびEDGEコンピューティングの可能性をカバーしています。

javascriptの分解:それが何をするのか、なぜそれが重要なのかjavascriptの分解:それが何をするのか、なぜそれが重要なのかApr 09, 2025 am 12:07 AM

JavaScriptは現代のWeb開発の基礎であり、その主な機能には、イベント駆動型のプログラミング、動的コンテンツ生成、非同期プログラミングが含まれます。 1)イベント駆動型プログラミングにより、Webページはユーザー操作に応じて動的に変更できます。 2)動的コンテンツ生成により、条件に応じてページコンテンツを調整できます。 3)非同期プログラミングにより、ユーザーインターフェイスがブロックされないようにします。 JavaScriptは、Webインタラクション、シングルページアプリケーション、サーバー側の開発で広く使用されており、ユーザーエクスペリエンスとクロスプラットフォーム開発の柔軟性を大幅に改善しています。

pythonまたはjavascriptの方がいいですか?pythonまたはjavascriptの方がいいですか?Apr 06, 2025 am 12:14 AM

Pythonはデータサイエンスや機械学習により適していますが、JavaScriptはフロントエンドとフルスタックの開発により適しています。 1. Pythonは、簡潔な構文とリッチライブラリエコシステムで知られており、データ分析とWeb開発に適しています。 2。JavaScriptは、フロントエンド開発の中核です。 node.jsはサーバー側のプログラミングをサポートしており、フルスタック開発に適しています。

JavaScriptをインストールするにはどうすればよいですか?JavaScriptをインストールするにはどうすればよいですか?Apr 05, 2025 am 12:16 AM

JavaScriptは、最新のブラウザにすでに組み込まれているため、インストールを必要としません。開始するには、テキストエディターとブラウザのみが必要です。 1)ブラウザ環境では、タグを介してHTMLファイルを埋め込んで実行します。 2)node.js環境では、node.jsをダウンロードしてインストールした後、コマンドラインを介してJavaScriptファイルを実行します。

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

MantisBT

MantisBT

Mantis は、製品の欠陥追跡を支援するために設計された、導入が簡単な Web ベースの欠陥追跡ツールです。 PHP、MySQL、Web サーバーが必要です。デモおよびホスティング サービスをチェックしてください。

Dreamweaver Mac版

Dreamweaver Mac版

ビジュアル Web 開発ツール

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強力な PHP 統合開発環境

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

このプロジェクトは osdn.net/projects/mingw に移行中です。引き続きそこでフォローしていただけます。 MinGW: GNU Compiler Collection (GCC) のネイティブ Windows ポートであり、ネイティブ Windows アプリケーションを構築するための自由に配布可能なインポート ライブラリとヘッダー ファイルであり、C99 機能をサポートする MSVC ランタイムの拡張機能が含まれています。すべての MinGW ソフトウェアは 64 ビット Windows プラットフォームで実行できます。

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい