問題描述

當(dāng)我刷新此頁面時(shí)，錨點(diǎn)還是指向panel2。此時(shí)利用CSS3:target偽類實(shí)現(xiàn)的錨點(diǎn)鏈接還在url上，這樣的話點(diǎn)擊一次之后，無論怎么刷新頁面當(dāng)前列表一直是打開的，而且如果有動(dòng)畫效果就會(huì)自動(dòng)顯示動(dòng)畫效果。

請問怎么實(shí)現(xiàn)刷新頁面去掉錨點(diǎn)鏈接。

問題解答

奇葩的需求

正常的需求：要不就是點(diǎn)擊tab的時(shí)候，不會(huì)改變上面的url；要不就是你現(xiàn)在的這種效果。

如果必須按照你現(xiàn)在的奇葩需求來做的話：先確定你的需求要不要把url的hash去掉，如果去掉的話，要在dom渲染之前完成去掉hash，不在之前去掉的話會(huì)有抖動(dòng)。如果不去掉的話，tab被點(diǎn)擊的時(shí)候增加class clicked，寫選擇器的時(shí)候就是 .clicked:target，這樣可以保證刷新進(jìn)入頁面不會(huì)被.clicked:target選中。

在頁面加載的事件中用js中作判斷如果當(dāng)前url后有錨點(diǎn)，則重定向到index.html

在路由前執(zhí)行

if (window.locaiton.hash !== '') { window.location.hash = '';}