【发布时间】:2021-10-18 20:07:42
【问题描述】:
我有一种情况,我必须在完全基于 ajax 的网站中使 URL 友好。我实际上在做的是我有 index.php 文件,并且只有 id #content-container 的 div。另一方面,我制作了单独的包含文件,即 Home.php About.php Contact.php。默认情况下 index.php 看起来像
Index.php
<body>
<div id="content-container">
<?php include 'Home.php'; ?>
</div>
</body>
假设有一个导航栏,我根据导航栏上的菜单进行了 ajax 调用,以便点击类似这样的内容
<script src="../Apparel/Js/jquery.js"></script>
<script>
const content = url => {
$.ajax({
url: url,
success: function(data) {
$('#content-container').html(data);
}
})
}
if (Menu Clicked == 'Home') {
content('Home.php');
} else if (Menu Clicked == 'About') {
content('About.php')
}
if (Menu Clicked == 'Contact') {
content('Contact.php')
}
这样做的目的是使网站类似于单页应用程序,我知道使用 React Angular 很容易做到这一点,但问题是我想以这种方式使用 ajax 以确保该策略将如何工作以清除我的概念。
现在我要强调的问题是使 URL 对这种类型的工作友好。请有人让我知道是否有办法让 URL 对这种情况友好?如果内容容器内有 about.php 的内容,则 URL 应该像这样 localhost/myApp/about.php 与手动键入 URL localhost/myApp/Contact.php 时相同,它应该打开 Contact.php
在内容容器内而不是只打开他的内容。我想要锚标签的功能,但要避免页面刷新
【问题讨论】:
标签: javascript php html jquery ajax