Javascript ajax成功后如何在不重新加载页面的情况下更改url
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/38089507/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to change url after success in ajax without page reload
提问by Dimas Adi Andrea
This is the ajax
这是阿贾克斯
$(".urut").change(function() {
$.ajax({
url: "<?php echo base_url(); ?>categories/brand/<?= $link_brand; ?>?l=<?= $l; ?>&h=<?= $h; ?>&city=<?= $city; ?>&city_name=<?= $city_name; ?>&ket=view",
type: "POST",
data: "urut=" + $(".urut").val(),
success: function(data) {
$("#result").html(data);
}
})
})This works, but i want the url to change because I have many parameters there and of course with the data: "urut="+$(".urut").val(),parameter as well.
这有效，但我希望 url 更改，因为我在那里有很多参数，当然还有data: "urut="+$(".urut").val(),参数。
回答by Sherly Febrianti
You can do this to your success action :
您可以对您的成功操作执行此操作：
window.history.pushState("object or string", "Title", "/new-url");
See this post to Modify the URL without reloading the pagefor a basic how-to.
请参阅此帖子以在不重新加载页面的情况下修改 URL，了解基本操作方法。
Additional Note:
- The first parameter is the data we'll need if the state of the web page changes, for instance whenever someone presses the back or forwards button in their browser. Note that in Firefox this data is limited to 640k characters.
- title is the second parameter which can be a string, but at the time of writing, every browser simply ignores it.
- This final parameter is the URL we want to appear in the address bar.
附加说明：
- 第一个参数是当网页状态改变时我们需要的数据，例如每当有人按下浏览器中的后退或前进按钮时。请注意，在 Firefox 中，此数据限制为 640k 个字符。
- title 是第二个参数，它可以是一个字符串，但在撰写本文时，每个浏览器都会忽略它。
- 最后一个参数是我们希望出现在地址栏中的 URL。
It's now available in most "modern" browsers.
它现在可以在大多数“现代”浏览器中使用。
回答by ArtisticPhoenix
Use the browser history to change the url bar in JS.
使用浏览器历史记录更改 JS 中的 url 栏。
history.pushState()
history.replaceState()
https://developer.mozilla.org/en-US/docs/Web/API/History_API
https://developer.mozilla.org/en-US/docs/Web/API/History_API
回答by king neo
try this
尝试这个
$(".urut").change(function() {
$.ajax({
url: "<?php echo base_url(); ?>categories/brand/<?= $link_brand; ?>?l=<?= $l; ?>&h=<?= $h; ?>&city=<?= $city; ?>&city_name=<?= $city_name; ?>&ket=view",
type: "POST",
data: "urut=" + $(".urut").val(),
success: function(data) {
$("#result").html(data);
window.history.pushState("Details", "Title", "<?php echo base_url(); ?>/yourNewPage");
}
});
});
});
