如何将GET方法与URL中的#标签一起使用?

时间:2018-07-08 02:18:06

标签: javascript php jquery ajax hash

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

到目前为止,我没有从$_GET['id']获得任何价值。我试图使用JavaScript从网址中删除主题标签,但没有任何反应:

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

我知道我可以使用ajax,但事实是,在使用GETPOST时我并不熟悉它。我正在尝试使用此锚点href

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

并将其发送到URL,而无需刷新页面。有可能做到这一点吗?

1 个答案:

答案 0 :(得分:0)

您似乎混淆了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() 监听器都无法自动识别新标签。这种动态的DOM处理是使“ AJAX”变得复杂的原因,而实际上并没有使其成为AJAX的一部分(因为AJAX只是发送GET或POST并处理答案)。