Мой главный вопрос.Используете ли вы этот метод?
Приведенный ниже код - это код, который я продумал и реализовал шаблон.
Я не видел этот шаблон в своей способности поиска.
ИтакЯ спрашиваю.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JQuery</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
// loding
var section = localStorage.getItem("menu");
var last_section;
if(section === 0) {
last_section = 0;
}
else {
last_section = section;
}
$("div").eq(last_section).toggleClass("dn");
// section jquery
var div_count = document.getElementsByTagName("div").length;
$("button").click(function() {
var index = $(this).index();
if(last_section === index) {
return;
}
$("div").eq(last_section).toggleClass("dn");
$("div").eq(index).toggleClass("dn");
last_section = index;
localStorage.setItem("menu", last_section);
});
});
</script>
<style>
div {
width: 100%;
height: 500px;
}
.dn {
display: none;
}
</style>
</head>
<body>
<nav>
<button>section1</button>
<button>section2</button>
<button>section3</button>
</nav>
<div class="dn" style="background-color: red;"></div>
<div class="dn" style="background-color: blue;"></div>
<div class="dn" style="background-color: yellow;"></div>
</body></html>
Я использовал этот код, чтобы подумать о проблеме
Если есть много div, время загрузки будет больше.Если это так, он будет показывать хорошую эффективность, когда вы будете использовать возможность переключения на меньшее количество элементов.
При обновлении мне пришлось использовать localstorage
, потому что нет физического адреса uri
Прошу.У вас есть другие проблемы при использовании?