刷新后如何根据单击的div加载php文件？

Question

因此，我的div如下，我所做的基本上是在准备好文档时加载默认的PHP文件，然后我基于单击的div加载不同的PHP文件。

<div class="menu">
   <div id="home" class="menu_align active_one">Home</div>
   <div id="write" class="menu_align">Write</div>
   <div id="activity" class="menu_align">Notifications</div>
</div>
<div id="main_content"></div>

<script type="text/javascript" src="jquery-3.2.1.js"></script>

<script type="text/javascript">
$(document).ready(function(){
   $("#main_content").load('home.php');
 });
$("#home").click(function(){
   $("#main_content").load('home.php');
});
$("#write").click(function(){
   $("#main_content").load('write.php');
});
$("#activity").click(function(){
   $("#main_content").load('notifs.php');
});

所以我想要的是，如果用户单击“写入”并刷新页面，则main_content应该加载write.php，其他所有div都相同。

Answer 1

您的click()事件在$(document).ready()外部，将其添加到$(document).ready() 。 里面的那些功能。 在DOM完全加载后，将执行ready（）函数。 要跟踪单击的页面，请将其保存到localStorage或cookies 。 在页面加载时，检查localStorage是否具有值，是否已加载该页面，否则加载默认页面。 这是工作示例。

 $(document).ready(function(){ if(localStorage.getItem("clicked")){ var clickedPage = localStorage.getItem("clicked"); $("#main_content").load(clickedPage); } else { $("#main_content").load('home.php'); } $("#home").click(function(){ $("#main_content").load('home.php'); localStorage.setItem('clicked', 'home.php'); }); $("#write").click(function(){ $("#main_content").load('write.php'); localStorage.setItem('clicked', 'write.php'); }); $("#activity").click(function(){ $("#main_content").load('notifs.php'); localStorage.setItem('clicked', 'notifs.php'); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="menu"> <div id="home" class="menu_align active_one">Home</div> <div id="write" class="menu_align">Write</div> <div id="activity" class="menu_align">Notifications</div> </div> <div id="main_content"></div>