ホームページ >ウェブフロントエンド >jsチュートリアル >jQueryで変更前に選択したドロップダウン値を保存する方法は?

jQueryで変更前に選択したドロップダウン値を保存する方法は?

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-11-17 13:32:02536ブラウズ

How to Preserve Select Dropdown Value Before Change with jQuery?

jQuery を使用して変更前の選択ドロップダウン値を保持する

これは、jQuery でフォーカス イベントと変更イベントを組み合わせることで実現できます。その方法は次のとおりです。

($ => {
  var previous;

  $("select").on('focus', function () {
    previous = this.value; 
  }).change(function() {
    alert(previous); 
    previous = this.value; 
  });
})();

このコードでは、focus イベントを使用してドロップダウンの現在の値を保存します。ドロップダウンが変更されると (変更イベント)、変更前の値にアクセスして表示できます。

この機能を同じページ上の複数の選択ボックス (AJAX 経由でページの読み込み後に追加されたものを含む) に適用するには、次の更新されたコードを使用できます:

$(document).ready(function() {
  $(document).on("focus", "select", function () {
    $(this).data('previous', this.value); 
  }); 

  $(document).on("change", "select", function() {
    const previous = $(this).data('previous'); 
    if (previous) {
      alert(previous); 
      $(this).data('previous', this.value); 
    }
  });
});

以上がjQueryで変更前に選択したドロップダウン値を保存する方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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