!++++
Ver.5 [ 機能を見る ] [ 機能設定を見る ]
Ver.6 [ 機能を見る ] [ 機能設定を見る ]
!----
1. はじめに
Client-side JavaScript で、値が変更された場合に限り、フォーカスが外れたタイミングでイベントが発生されるように制御できます。
このページでは、その動作を確認できるサンプルをご紹介します。
2. サンプル機能の内容と確認ポイント
フォーカスが外れたタイミングで発生するイベントは、「ブロック設定画面 > 項目情報 > FOCUS OUT」で設定されています。
data-prev-value 属性には直前の値を保持しておき、FOCUS OUT イベント発生時に現在の値と比較します。値が異なっていれば、電話番号の値を削除し、現在の値を data-prev-value 属性に上書きします。
なお、初回の FOCUS OUT イベントでは比較対象となる前回値が存在しないため、事前に resizeContents_end 関数内で初期値を data-prev-value 属性に設定しておきます。
🔍 確認いただけるポイント
-
「名称」を変更することで「電話番号」が削除されること
変更例:
- 「名称」を 'あいうえお' から 'かきくけこ' に変更 → 「電話番号」が削除される
3. 画面イメージ
以下は、最上部の「名称」を 'かきくけこ' に変更した際に、「電話番号」がクリアされる状態を示しています。
「名称」の変更前
「名称」の変更後