在使用Bootstrap 4和Ajax刷新页面后如何在导航选项卡中保持手风琴打开

Question

我正在尝试在刷新页面后在nav-tab中保持活动手风琴的打开状态。刷新页面后，我的导航选项卡可以正常工作，这意味着它已经停留在活动选项卡上。但是，当我单击“第二个”手风琴项目并刷新页面时，它会自动关闭。预先谢谢你。

//KEEP THE ACTIVE NAV-TAB OPEN AFTER PAGE REFRESH
$('a[data-toggle="tab"]').click(function (e) {
	e.preventDefault();
	$(this).tab('show');
});

$('a[data-toggle="tab"]').on("shown.bs.tab", function (e) {
	var id = $(e.target).attr("href");
	localStorage.setItem('selectedTab', id)
});

var selectedTab = localStorage.getItem('selectedTab');
	if (selectedTab != null) {
		$('a[data-toggle="tab"][href="' + selectedTab + '"]').tab('show');
	}

<ul class = "nav nav-tabs">
	<li class = "nav-item"><a href = "#monitor" data-toggle = "tab" class = "nav-link active">Book Monitoring</a></li>
	<li class = "nav-item"><a href = "#history" data-toggle = "tab"class = "nav-link">Book's History</a></li>
</ul>
<div class = "tab-content">
				
	<div class = "tab-pane container active" id = "monitor">
		<br />
		<h5>Monitoring of Books</h5>
	</div>
					
	<div class = "tab-pane container" id = "history">
		<br />
		<h5>History of Borrowed Books</h5>
						
	<!-- STARTS OF ACCORDION -->
	<div id = "accordion">
		<div class = "card">
			<div class = "card-header">
				<a href = "#stud_collapse" class = "card-link" data-toggle = "collapse">Borrowed by Students</a>
			</div>
				<div class = "collapse" id = "stud_collapse" data-parent = "#accordion">
					<div class = "class-body">
						Student's Data 
					</div>
				</div>
		</div>
		
		<div class = "card">
			<div class = "card-header">
				<a href = "#teach_collapse" class = "card-link" data-toggle = "collapse">Borrowed by Teachers</a>
			</div>
				<div class = "collapse" id = "teach_collapse" data-parent = "#accordion">
					<div class = "class-body">
						Teacher's Data
					</div>
				</div>
		</div>
	</div>
</div>
</div>

这是我试图使活动手风琴“在导航选项卡中”打开的方式，但是它不起作用：

    $('a[data-toggle="collapse"]').click(function (e) {
        e.preventDefault();
        $(this).collapse('show');
    });

    $('a[data-toggle="collapse"]').on("shown.bs.collapse", function (e) {
        var id = $(e.target).attr("href");
        localStorage.setItem('selectedAccordion', id)
    });

    var selectedAccordion = localStorage.getItem('selectedAccordion');
    if (selectedAccordion != null) {
        $('a[data-toggle="collapse"][href="' + selectedAccordion + '"]').collapse('show');
    }