如何在 URL 中使用带有井号标签的 GET 方法？

Posted 2023-03-29

【中文标题】如何在 URL 中使用带有井号标签的 GET 方法？

【英文标题】：How can I use the GET Method with a hashtag in the URL?

【发布时间】：2018-12-16 02:57:44

【问题描述】：

例如：www.example.com#?id=10

到目前为止，我没有从 $_GET['id'] 获得任何价值。我尝试使用 javascript 从 URL 中删除主题标签，但没有任何反应：

$(document).ready(function()
   $(window.location.hash).modal('show');
   $('a[data-toggle="modal"]').click(function()
      window.location.hash.replace('#', '') = $(this).attr('href');
   );
);

我知道我可以使用 ajax，但在使用 GET 和 POST 时我不熟悉它。我正在尝试接受这个锚href：

echo '<a  href="?id='.$row['id'].'" id="smallbtn" data-toggle="modal"
                          data-target="#small"  data-modal="small">';

并在不刷新页面的情况下将其发送到 URL。有可能做到这一点吗？

【问题讨论】：

window.location.hash.replace('#', '') = $(this).attr('href') 这是一个无效的分配，您应该在控制台中看到一个错误。此外，如果您想在不刷新页面的情况下发送内容，则需要使用 ajax，或者如果不想学习该 api，则必须通过设置 iframe 的 src 来完成。但是学习 ajax 会是更好的选择。

Can I read the hash portion of the URL on my server-side application (php, Ruby, Python, etc.)?的可能重复

@PatrickEvans 技术上不发送任何内容，只是更新 URL。除非你说的是同一件事。我将如何用我的代码实现 ajax？

【参考方案1】：

您似乎混淆了 PHP 和 JavaScript，因为您显示的两个语句都来自双方。所以你的问题不是很清楚......

当你点击一个锚链接时，浏览器会这样做：

window.location = jQuery("#smallbtn").attr("href");

因此，如果这就是必须发生的一切（显然），您不必自己这样做。

现在，您提到了锚点 (#something)，但在您的示例中，您没有任何锚点。如果您当前在您的 URL 中有一个锚点，并且您试图在用户单击链接时摆脱它，那么这就是它的工作原理。再说一遍，没什么可做的。

如果“href”属性中可能有一个锚点并且您不想要它，那么您想做这样的事情：

var href = jQuery("#smallbtn").attr("href"),
    parts = href.split("#");

window.location = parts[0]; // ignore anything after the '#'

但是，无论哪种方式，这都会强制重新加载新位置。根据您所说，您想要“更改 URL”（在位置栏中）但不重新加载页面。这是使用浏览器的History API 完成的。现在大多数都支持该功能。

window.history.pushState(
    
        "html": html,
        "pageTitle": page_title
    ,
    "",
    url);

pushState() 定义页面 HTML、标题和 URL。它不会重新加载任何内容，也不会更改浏览器中的任何内容。那是你的责任。将改变的一件事是地址栏中的 URL。它被设置为“url”。

要更改浏览器标题，请执行以下操作：

document.title = page_title;

要更改您的浏览器 HTML（假设您要更改整个页面），您可以这样做：

jQuery(body).innerHTML = html;

不过，总而言之，您必须学习 AJAX。坦率地说，它只是使用jQuery.ajax 对象向您的 PHP 代码发送一个 GET 或 POST 请求，该请求以 XML 或 JSON 响应（XML 与 jQuery 很好，它可以像 DOM 一样解析它）并在您回调时使用该数据调用以更改客户端的标题、HTML 等。仅此而已！

我认为最难的部分不是 AJAX 本身，而是当您更改 DOM 时，现有的 jQuery() listeners 无法自动识别新标签这一事实。这种动态 DOM 处理使“AJAX”变得复杂，但它实际上并没有成为 AJAX 的一部分（因为 AJAX 只是发送 GET 或 POST 并处理答案。）

【讨论】：

非常感谢。我肯定会研究ajax。还有一个问题，如何在当前代码中正确实现replace('#', '')？这个：window.location.hash.replace('#', '') = $(this).attr('href');@AlexisWilke

这就是我的第二个代码示例的内容。您获得href 属性，从中删除任何#....，并将其余部分放入window.location（即parts[0]）。如果您的href 中没有任何#...，则只需执行window.location = href 即可。它将删除您在那里拥有的任何哈希标签。

非常感谢！在我的最新问题中，我使用 ajax post 方法和 php。问题是即使是从 ajax 发送的，php 也没有接收到 post 方法数据。我知道，因为我检查了网络选项卡，一切正常。这是因为 POST 方法没有更新还是不是动态的？

您需要在双方的代码中发布一个新的 *** 问题，以便我们提供帮助。就这样，我一点头绪都没有。