javascript - 根据文档准备好的 URL 参数选择选项和检查复选框的功能

Question

我需要一个函数来循环所有 URL 参数并根据id 和 value自动选择选项，以及根据name 和 value自动检查复选框。我已经在使用getUrlParameter这里找到的函数：https ://stackoverflow.com/a/21903119 ，所以我需要的是在 document.ready 上的 URL 中找到的所有参数的循环，并相应地设置选择选项和输入复选框。

url: htt....// domain.com/site/page?param1=val1¶m2=val2

并且如果将 param1、param2 与任何选择选项 id 或复选框名称匹配：1）如果是选择选项检查相应的值...或 2）如果是复选框并且如果具有相同的值显示在 url 参数中检查它

编辑：因为有人编辑了我的标题，我不得不提一下：它应该是 javascript，jQuery 不是这种情况的选择。

标签： javascript

Answer 1

我试图达到你想要的，我希望这会有所帮助。

您可以使用以下代码执行此操作：

var sPageURL = window.location.search.substring(1);
var sURLVariables = sPageURL.split('&');
for (i in sURLVariables) { 
  let sParameter =sURLVariables[i].split('='); 
  let name=sParameter[0]
  let value=decodeURIComponent(sParameter[1])
  //Here is a loop
  //Do something for each name-value pair
  let collection = document.getElementsByName(name)
  for(j in collection){
    //searching for matching names (for checkboxes)
    if(collection[j].value=value)collection[j].checked=true
  }
  let node = document.getElementById(name)
  //checking element by ID (for select lists)
  if(node){
    node.value=value
  }
}

例子：

请求参数：

?a=b&c=d&e=f

HTML：

<select id="a"><!-- Will be set to b-->
  <option>a</option>
  <option>b</option>
  <option>c</option>
</select>
<input type="checkbox" name="c" value="d"/><!--Will be checked-->
<input type="checkbox" name="c" value="f"/><!--Will NOT be checked-->
<input type="checkbox" name="e" value="d"/><!--Will NOT be checked-->