【问题标题】:How I Make Friendly URL on Ajax based Website?如何在基于 Ajax 的网站上制作友好的 URL?
【发布时间】: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


    【解决方案1】:

    您可以通过 ajax 调用单个 PHP 脚本来实现此目的,将请求类型(家庭、关于、联系人等)作为参数传递,例如使用 get "https://example.php?type=home" ,然后在 example.php 中检查 type 的内容并生成相应的 html。

    【讨论】:

    • 这可能可行,但如果可能的话,我想让这个扫描仪的 url 更友好我的意思是,而不是这个“example.php?type=home”我想要这样的东西“example.php/home”跨度>
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-04-11
    • 1970-01-01
    • 2011-03-16
    • 1970-01-01
    • 1970-01-01
    • 2012-02-12
    • 2011-01-26
    相关资源
    最近更新 更多