bạn phải đặt id hoặc class riêng biệt cho mỗi menu. mỗi lần lưu lại vào localStorage thì b lưu cái id. mỗi cái id cho từng menu phải khác nhau. Sau đấy khi b load lại trang thì bạn so sánh cái id trùng với div nào thì bạn add thêm class active cho div đó chứ không phải là lưu vào localStorage đều chung tên active như vậy thì nó biết cái nào là đang active chứ nhỉ. Với đoạn code của bạn có thành sửa thành như sau :
$[document].ready[function[]{
var menuClass = localStorage.getItem['menuClass']
var element = document.getElementById[menuClass];
if [element] {
element.classList.add['active'];
} else {
element = document.getElementById["home"];
element.classList.add['active'];
}
$[".toggle"].click[function [] {
$[this].toggleClass["active"];
$['.navigation'].toggleClass["active"];
}];
$[document].on['click', 'ul .list', function [] {
let menu = $[this].attr["id"]
$[this].addClass['active'].siblings[].removeClass['active'];
localStorage.setItem['menuClass', menu];
}]
}]
Lưu ý thêm id và xóa hết tất cả class active cho mỗi menu để chạy được nhé !
Tìm hiểu cách thêm một lớp hoạt động vào phần tử hiện tại với JavaScript.
Đánh dấu nút Active/Dòng điện [nhấn]:
Hãy tự mình thử »
Yếu tố hoạt động
Bước 1] Thêm HTML:Thí dụ
& nbsp; 1 & nbsp; 2 & nbsp; 3 & nbsp; 4 & nbsp; 5
1
2
3
4
5