ホームページ > ウェブフロントエンド > jsチュートリアル > サイズ変更の完了後に jQuery のサイズ変更イベントを 1 回だけトリガーするにはどうすればよいですか?

サイズ変更の完了後に jQuery のサイズ変更イベントを 1 回だけトリガーするにはどうすればよいですか?

Linda Hamilton
リリース: 2024-11-27 02:03:10
オリジナル
602 人が閲覧しました

How to Trigger a jQuery Resize Event Only Once After Resizing is Complete?

サイズ変更完了後に jQuery Resize イベントを 1 回だけ呼び出す方法

問題の概要

jQuery のサイズ変更イベントを使用して関数を呼び出すと、ユーザーがサイズを変更するときにイベントが繰り返し呼び出される可能性があります。ブラウザウィンドウ。目標は、サイズ変更が完了したときに関数を 1 回だけトリガーすることです。

解決策

これを実現するには、setTimeout 関数とタイムアウト変数を利用できます。

var timeout;
$(window).resize(function() {
  // Function to execute when resizing is complete
  timeout = setTimeout(function() {
    // Execute the desired function
  }, 30);
});
ログイン後にコピー

タイムアウトを 30 ミリ秒に設定することで、サイズ変更が完了するまで関数の実行を遅らせます。少なくとも 30 ミリ秒間停止している。これにより、関数が 1 回だけ呼び出されることが保証されます。

追加の考慮事項

タイムアウトが期限切れになる前にユーザーが別のサイズ変更アクションを開始すると、前のタイムアウトはクリアされ、新しいものが設定されます。これにより、関数は最終的なサイズ変更後に常に 1 回だけ実行されるようになります。

注意: タイムアウトなどのグローバル変数の使用は、可能であれば避けてください。ただし、この場合、イベント処理の状態を維持するためにタイムアウト変数を使用する必要があります。

以上がサイズ変更の完了後に jQuery のサイズ変更イベントを 1 回だけトリガーするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート