javascript - 在文档就绪时根据 URL 参数选择选项并检查复选框的功能

Question

我需要一个函数来循环所有 URL 参数并根据id 和值自动选择选项，以及根据名称和值自动选中复选框。我已经在使用此处找到的 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 不是这种情况的选择。

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-->