Ajax 调用后 url 中的 data-id 没有改变
Posted
技术标签:
【中文标题】Ajax 调用后 url 中的 data-id 没有改变【英文标题】:After Ajax call data-id in the url doesn't change 【发布时间】:2016-11-09 22:56:21 【问题描述】:我正在输出多个使用相同<a>
的动态链接。我的 AJAX 调用可以很好地加载所有链接的内容,但 URL 始终显示第一个链接的 id。当点击不同的链接时,如何让它更改 url 中的 id?
$string .= '<a class="hrefid" data-id="'.$name["id"].'" href="#link">'.$name["name"].'</a>'.
<div id="content"></div>
$('.hrefid').on('click', function (e)
var load = $(e.target).attr("href");
if(load == "#link")
$.ajax(
type: 'post',
url: "/page/test/"+$(this).parents("[data-id]").attr("data-id"),
complete: function (event)
$("#content").contents().remove();
$("#content").append(event.responseText);
history.replaceState(, "", "link"+$('[data-id]').first().attr('data-id'));
);
);
【问题讨论】:
问题可能是你使用history.replaceState:***.com/questions/12832317/… 【参考方案1】:这里是解决方案...
$('.hrefid').on('click', function (e)
var $this = $(this);
var load = $(e.target).attr("href");
if(load == "#link")
$.ajax(
type: 'post',
url: "/page/test/"+id,
complete: function (event)
$("#content").contents().remove();
$("#content").append(event.responseText);
history.replaceState(, "", "link" + $this.attr('data-id'));
);
);
【讨论】:
【参考方案2】:您必须将 id 值传递给 jquery。将值传递给 jquery 后,您需要告诉 url 将传输数据的文件。
$('.hrefid').on('click', function (e)
var load = $(e.target).attr("href");
var id = $('#your input id').val();
if(load == "#link")
$.ajax(
type: 'post',
url: "/page/test.php?action=update&id="+id,
complete: function (event)
$("#content").contents().remove();
$("#content").append(event.responseText);
history.replaceState(, "", "link"+$('[data-id]').first().attr('data-id'));
);
);
关于 test.php
if($_GET[action] == "update")
$id = $_GET['id'];
echo $id;
【讨论】:
【参考方案3】:我认为,您不能以编程方式更改地址栏中的 url 链接,因为这违反了安全规则。 想象一下,你打开一个糟糕的网站,它显示的页面与你最喜欢的银行页面完全相同,用于账户操作,而且地址栏中的 url 链接与银行的相同......所以你不会怀疑这不是真正的银行页。您在此页面上的操作可能会导致将您的凭据交给坏人。
您可以通过编程方式更改 url 链接的哈希部分。 这里是关于hash fragment of url的wiki
【讨论】:
以上是关于Ajax 调用后 url 中的 data-id 没有改变的主要内容,如果未能解决你的问题,请参考以下文章
jquery 中的对象,在ajax 回传后,不能正常调用的解决办法