javascript在url中传递变量，然后选择选择选项

Question

我试图弄清楚如何在一个页面上传递分配给链接的变量，然后在另一个页面上的表单中预填充选择选项。

源页面链接：example.com/page?value=2

表单页面：

<select name="select_name" id="id_name" class="select-success">
<option selected="selected" value=""></option>
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
</select>

通过阅读各种文章和代码，我必须处理不符合该标准的情况。 我有点不识字。 我用以下形式将其拼凑在页面上：

document.getElementByType(“select").value = location.search.replace('?','');

没有得到任何结果。 该表单是在后端生成的，因此我无法向<option>添加id / class或其他任何内容。

Answer 1

这会将查询字符串转换为键=>值对象：

var qs = location.search.substr(1).split('&').reduce(function(prev, cur) {
  var split = cur.split('=');
  prev[split[0]] = decodeURIComponent(split[1]);
  return prev;
}, {});

这将设置所选项目：

window.addEventListener('load', function() {
   document.getElementById("id_name").value = qs.value;
});

Answer 2

我会使用本地存储来做到这一点。 签出： https : //github.com/js-cookie/js-cookie

仅在第一页上：

Cookies.set('name', 'value');

在下一页上：

Cookies.get('name'); // => Returns 'value'

Answer 3

我不是Java语言专家，但是您可以肯定地使用一些以前制作的解决方案来解决您的问题。

在此StackOverflow的另一篇文章中，您可以找到如何修改URL来设置GET参数，以及如何检查该参数是否已经存在。

要更改SELECT值，建议您为其分配一个ID，然后通过ID而不是Type来引用它。 像这样：

document.getElementById('id_name').value = window.location.search.replace("?", "");

希望这可以帮助！

Answer 4

1.）您没有正确解析搜索字符串。

location.search // "?value=2"

2.）. .getElementByType()不是方法

解

有很多解析查询字符串值的方法，但这是一种适合您的1行解决方案。

document.getElementById('id_name').value = location.search.replace('?value=','');