第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何使用 jQuery/Javascript 將值保存到 localStorage

如何使用 jQuery/Javascript 將值保存到 localStorage

繁華開滿天機 2023-06-15 10:24:24
我有這段代碼: $(document).ready(function () {                $('.pbox:gt(0)').hide();                $('#buttons').on('click', 'a', function () {                    $('.current').not($(this).closest('li').addClass('current')).removeClass('current');                    localStorage.setItem('mySelectValue', $(this).index());                    $('.pbox:visible').hide(600);                    $('.pbox[id=' + $(this).attr('data-id') + ']').show(600);                });            });.current {  background-color:red}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script><ul id="buttons">   <li>      <a data-id="div1">One</a>   </li>   <li>      <a data-id="div2">Two</a>   </li>   <li>      <a data-id="div3">Three</a>   </li>   <li class="current">      <a data-id="div4">Four</a>   </li></ul><div class="pbox" id="div1">  Content 1</div><div class="pbox" id="div2">    Content 2</div><div class="pbox" id="div3">    Content 3</div><div class="pbox" id="div4">    Content 4</div>我試圖實現(xiàn)的是將這些值(當(dāng)您單擊a元素時)保存到 loaclstorage,因此當(dāng)我刷新頁面時,此類current不會消失。有人可以幫我解決這個問題嗎?
查看完整描述

1 回答

?
夢里花落0921

TA貢獻(xiàn)1772條經(jīng)驗 獲得超6個贊

首先,我提取了將所選元素設(shè)置為它自己的函數(shù)的功能:(熱門提示,ids 是唯一的。在 jquery 中查找?.data()...和 HTML數(shù)據(jù)集屬性;請參閱函數(shù)的最后一行)

? function setSelected($el) {

? ? ? $('.current').not($el.closest('li').addClass('current')).removeClass('current');

? ? ? localStorage.setItem('mySelectValue', $el.data('id'));

? ? ? $('.pbox:visible').hide(600);

? ? ? $('#'+ $el.data('id')).show(600);

? }?

然后,我們只需在加載時檢查一個值,如果存在,就用這個值調(diào)用同一個函數(shù):


? ? const localID = localStorage.getItem('mySelectValue')

? ? if (localID) setSelected($('[data-id="' +localID + '"]'))

最終的Javascript:


? function setSelected($el) {

? ? ? $('.current').not($el.closest('li').addClass('current')).removeClass('current');

? ? ? localStorage.setItem('mySelectValue', $el.data('id'));

? ? ? $('.pbox:visible').hide(600);

? ? ? $('#'+ $el.data('id')).show(600);

? }?

? ?$(document).ready(function () {

? ? ? $('.pbox:gt(0)').hide();

? ? ? $('#buttons').on('click', 'a', function () {

? ? ? ? ? setSelected($(this))

? ? ? });

? ? ? const localID = localStorage.getItem('mySelectValue')

? ? ? if (localID) setSelected($('[data-id="' +localID + '"]'))

? ? });


查看完整回答
反對 回復(fù) 2023-06-15
  • 1 回答
  • 0 關(guān)注
  • 170 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號