ユーザーがさまざまなボタンを使用して特定のページ要素を動的に追加できるWebページ(すべてクライアント側のコードで実行)があります。
たとえば、「グループの追加」というボタンをクリックして、グループ名を入力できます。これにより、<div class="customGroup">
新しく作成された要素内にさらに要素を追加できる他のボタンの中で、グループを「タイトル」として表示するが作成され<div>
ます。
ユーザーがウィンドウを閉じて再度開いたり、ページをリロードしたりした場合に、ユーザーが行ったことを保存し、失わないようにしたいと考えています。したがって、たとえば、グループ「Foo」を追加してページを更新すると、ページがすべてHTML / JavaScriptである場合、「Foo」は失われます。
それらのアクションを記録し、キャッシュ/ Cookieを使用してそれらを再実行する方法はありますか?それとも他の方法でそれを行う必要がありますか?これも可能ですか?
ローカルストレージを使用して、ウィンドウの開閉全体でこのデータを保持することをお勧めします。
関心のある要素にイベントリスナーをアタッチすることで、ユーザーが何をクリックしたかを知ることができます。そこに渡す関数は、クリックされたアイテムを配列にプッシュすることで、それらへの参照を保持できます。次に、.click()を使用するときにそれらをクリックできます。
データの送信時にユーザーが入力するテキストについては、ローカルストレージに文字列として入力してください。ページの読み込み時に、このデータを好きな場所に配置できるので、要素innerHTMLとvoilaにデータを渡すと、ページの状態を再構築できます。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加