Charm.js v3.6.1 をリリースしました！
今回のアップデートでは、名前削除後の挙動の仕様を変更し、従来の動作も選べるように改修しました。
HTMLのvalue属性が反映されるように
これまでのバージョンでは、保存済みの名前が存在しない場合でも、JavaScript側で input.value が空文字に上書きされてしまう挙動となっていました。そのため、以下のようにHTMLで初期値を指定していても、初回表示で空欄になってしまう問題がありました。
<input type="text" value="ゆめこ" id="charmname1" class="charm">
今回の修正では、保存データが存在しない場合には、HTMLに記載されたvalue属性をそのまま活かすよう変更しました。
初期値を指定しておきたい場合でも、意図どおりに表示されるようになります。
対象となる挙動について
この修正は以下の条件下で有効です。
- 対象のinputに保存済みデータが存在しない
- かつ、input.valueが空文字である（フォームが未入力）
この条件を満たす場合に限り、input.defaultValue（HTMLに記載されたvalue属性の値）がinputに表示されます。保存済みのデータがある場合には、従来どおり保存値が優先されます。
注意点
自動保存との併用について
charmnowまたはcharmnowsessionクラスを使った自動保存機能との併用は、今回の修正と相性が悪いため、非推奨とさせていただきます。
初期値を入力済みの状態で自動保存を有効にすると、閲覧者さんが削除や修正を試みた直後に、不完全な状態がそのまま表示される可能性があります。
特に名前欄を編集しようとしてBackspaceを押した直後などに中途半端な文字列が保存されたままになったり、初期値を復元できないことがあるため、想定どおりの動作とならない場合があります。
そのため、初期値を指定する場合は、明示的な保存ボタンで登録を行う構成を推奨します。
初期値を予め名前登録するものではありません
inputタグのvalue反映の一連のお話は、inputタグの見た目の初期表示を設定するためのものです。
「事前に名前登録されている状態にする」ためのものではありませんのでご注意ください。
この初期値は、保存データが存在しない場合にのみ表示され、自動で保存されることはありません。
閲覧者さんが登録ボタンを押すなどして保存処理を行わない場合は、表示部分のspanタグは変換されず、spanタグに書かれた文字がそのまま表示されます。
CDNとGitHub
最新版CDNはv3.6.1へ更新済みです。
バージョン固定のCDNもv3.6.1を用意しました。
アーカイブとして、圧縮前コードも含めたダウンロード用zipも追加済みです。
補足・余談
今回の修正により既存の保存動作に影響が出ることはありません。
すでに保存済みの名前や、登録ボタン・削除ボタンの挙動は、valueを使用しないのであれば、これまでどおりの動作ですので、引き続き安心してご利用いただけます。
今後ともCharm.jsをよろしくお願いいたします！
