jQuery $(document).ready と UpdatePanels: 洗練された外観
jQuery を利用して UpdatePanel 内の要素にマウスオーバー効果を適用する場合、最初のページ読み込みは意図したとおりに機能します。ただし、UpdatePanel によって開始される部分的なページ更新中、マウスオーバー効果はその特定の領域内で機能しなくなります。
これは、UpdatePanel がパネルのコンテンツをオーバーホールし、以前の要素に関連付けられたイベント サブスクリプションを効果的に削除するために発生します。 。この問題に対処するには、更新のたびに必要なイベントを再サブスクライブすることをお勧めします。これは、初期ロード用の $(document).ready とその後の更新用の Microsoft の PageRequestManager オブジェクトを組み合わせることで実現できます。
UpdatePanel が存在する場合に自動的に使用できる JavaScript オブジェクトである PageRequestManager は、トリガーとなる endRequest イベントを提供します。アップデート完了後。以下に示すように、これを利用して jQuery イベントを再バインドできます。
$(document).ready(function() { // Initial event binding }); var prm = Sys.WebForms.PageRequestManager.getInstance(); prm.add_endRequest(function() { // Event re-binding after update });
PageRequestManager イベントは、sender およびeventArgs へのアクセスを提供し、再バインドをよりきめ細かく制御できます。詳細については、Microsoft のドキュメントを参照してください: msdn.microsoft.com/.../bb383810.aspx
非常に動的なシナリオに特に適した代替アプローチには、jQuery の .on() メソッドの利用が含まれます。 .on() は、頻繁に再サブスクリプションを行う場合に比べて効率が向上します。ただし、すべての jQuery プラグインが .on() を利用できるように簡単にリファクタリングできるわけではないため、決定を下す前にドキュメントを徹底的に確認することが重要です。このような場合、再サブスクリプションがより現実的な解決策となります。
以上がASP.NET UpdatePanels で jQuery のマウスオーバー効果を維持するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。