Я хочу, чтобы содержимое страницы изменялось при нажатии на ссылку в боковой панели, а также URL-адрес должен меняться без перезагрузки боковой панели. Мне удалось добиться изменения основного содержимого страницы без перезагрузки боковой панели, но мне также нужно изменить URL-адрес и указать, какой контент на боковой панели нажимается.
Как изменить содержание
HTML - при нажатии Добро пожаловать или Создание учетной записи вызывает функцию changeContent()
<div class=" sidebar-item sidebar-menu">
<ul>
<li class="header-menu">
<span>Get Started</span>
</li>
<li>
<a onclick="changeContent('/docs')"> <span id="welcome-btn" class="menu-text">Welcome</span> </a>
</li>
<li class="sidebar-dropdown">
<a> <span class="menu-text">Setting up</span>
</a>
<div class="sidebar-submenu">
<ul>
<li> <a id="creating-account" onclick="changeContent('/docs/settingUp')">
Creating account</a> </li>
<li> <a href="#">Starting transactions</a> </li>
<li> <a href="#">Resolving transactions</a> </li>
<li> <a href="#">Refund</a> </li>
</ul>
</div>
</li>
</div>
<!-- page-content -->
<div class="main--c">
<%- include ../partials/docs/welcomeDocs.ejs %>
</div>
JAVASCRIPT
function changeContent(url) {
$('.main--c').load(url);
}
Мой экспресс-конфиг
router.get('/docs', (req: Request, res: Response) => {
res.render('pages/docs');
})
router.get('/docs/settingUp', (req: Request, res: Response) => {
res.render('partials/docs/settingUp');
})
Это работает, оно меняет содержимое без перезагрузки всей страницы, но когда вы нажимаете Создать учетную запись Я хочу также изменить URL. Чтобы каждый раз, когда кто-то вводил URL в браузер, он загружал страницу создания .
Я пытался добавить href="docs/settingUp"
к тегу привязки, но вместо этого он загружал только часть страницы безНавбар и другие стили