javascript - Javascript更改url参数不生效
问题描述
我正在尝试使用javascript使用一些自定义参数(lang)刷新页面,以更改使用的语言。
我的后端使用查询参数 lang 知道所选择的语言,这可能是英语的“en”或法语的“fr”。
当我在浏览器中手动添加参数时,它工作得很好,但是当使用 javascript 时,我得到了正确的 url(可使用警报显示),但浏览器文本框中的 url 保持不变。
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<body>
<ul th:fragment="languages-chooser" class="navbar-nav ml-auto">
<style>
.flag-icon {
font-size: 20px !important;
}
</style>
<li class="badge badge-light nav-item mr-3">
<a href="" onclick="change_language('en')">
<span class="flag-icon flag-icon-us"></span>
</a>
</li>
<li class="badge badge-light nav-item mr-3">
<a href="" onclick="change_language('fr')">
<span class="flag-icon flag-icon-fr"></span>
</a>
</li>
<script>
function change_language(lang) {
localStorage.lang = lang;
alert("new url: " + updateUrlParam("lang", lang));
window.location.href = updateUrlParam("lang", lang);
}
function updateUrlParam(key, value, url) {
if (!url)
url = window.location.href;
var re = new RegExp("([?&])" + key + "=.*?(&|#|$)(.*)", "gi"),
hash;
if (re.test(url)) {
if (typeof value !== 'undefined' && value !== null) {
return url.replace(re, '$1' + key + "=" + value + '$2$3');
}
else {
hash = url.split('#');
url = hash[0].replace(re, '$1$3').replace(/(&|\?)$/, '');
if (typeof hash[1] !== 'undefined' && hash[1] !== null) {
url += '#' + hash[1];
}
return url;
}
}
else {
if (typeof value !== 'undefined' && value !== null) {
var separator = url.indexOf('?') !== -1 ? '&' : '?';
hash = url.split('#');
url = hash[0] + separator + key + '=' + value;
if (typeof hash[1] !== 'undefined' && hash[1] !== null) {
url += '#' + hash[1];
}
return url;
}
else {
return url;
}
}
}
</script>
</ul>
</body>
</html>
解决方案
我找到了解决方案。
我正在使用<a href=""
/> 显然指向没有任何参数的索引页面,将其更改为<a href="#" />
推荐阅读
- webpack - 在使用 FastAPI 服务并通过 Jinja 模板传递的 Google Chrome 中使用 vue-cli(和 webpack / babel)加载缩小的 javascript 构建时出错
- php - 根据 WooCommerce 购物车小计自动添加可变数量的特定产品
- python - 使用 python matplotlib imshow 在二维数组上动画马尔可夫链的演变
- r - 验证是否存在另外两封邮件
- python - 使用多个命令创建一个 Stdout 和 stderr 文件并压缩输出
- postgresql - thymeleaf 页面上的源不能为空
- import - SAS proc导入guessingrows问题
- assembly - NASM 程序集 x86:是否可以在循环中编写循环?(需要修复冒泡排序)
- python - 使用网格 Matplotlib 确定绘图大小
- ios - ViewController 何时设置 @IBOutlet 属性?