前提・実現したいこと
jQueryを使ってセッションストレージに配列を保存したいです。
発生している問題・エラーメッセージ
ボタンクリックのたびに増えるべき配列が、1つしか保存されません。
「「h6のテキストと、tagの配列」の配列」を、クリックするたびに増やしていきたいのに、それが増えてくれません。
該当のソースコード
お目汚しですが、自分なりに書いたソースコードです。
ボタンクリックで配列を「追加し続けて保存したい」と考えているのですが、何度ボタンをクリックしても「1度しか保存されない」状況です。
html
1<h6>Hello</h6> 2<ul> 3 <li>Ruby</li> 4 <li>JavaScript</li> 5 <li>PHP</li> 6</ul> 7<button type="button">Save</button>
jQuery
1$('button').click(function() { 2 3 // 現在の値 4 let current = JSON.parse( window.sessionStorage.getItem('list') ); 5 current = (current) ? current : []; 6 7 // 新しい値 8 const ttl = $('h6').text(); 9 let tags = []; 10 $('li').each(function(i, e){ 11 tags.push( $(e).text() ); 12 }); 13 const plus = { 14 'ttl': ttl, 15 'tags': tags, 16 } 17 18 // 更新する値 19 const update = $.merge(plus, current); 20 21 // セッションに保存 22 window.sessionStorage.setItem( 'list', JSON.stringify(update) ); 23 24});
試したこと
配列の連結がおかしいのかと考えまして、
「const update = $.merge(plus, current);」を
「const update = plus.concat(current);」と変えてもできず、
ほかに思い至ることができませんでした。
補足情報(FW/ツールのバージョンなど)
jQuery最新で、Chromeを使っています。
初心者で必要な情報など不足しているかもしれませんが、どうぞ遠慮なく仰ってください。
どうぞ宜しくお願い致します。