根据URL值将设置检查为true

Question

我正在将一个值从表单传递到页面。

url为：http://url.com/page?land1=value

或者，如果是空的，它只是：http://url.com/page

我在这个页面上有一个复选框，代码是：

<input id="Nederland" name="interest8" type="checkbox">
<label for="Nederland">
<div class="checkbox-text">
Nederland
</div>
</label>

然后我的JS检查URL是否包含land1值：

function getCheckboxwaardes(){
var url_string = window.location.href;
var url = new URL(url_string);
var land1 = url.searchParams.get("land1");
var land1_input = document.getElementById('Nederland');
if (land1 !== "") {land1_input.checked = true;}
}

这个函数非常有效，但问题是它只检查land1是否为空。它甚至不检查URL是否包含land1。有人知道怎么做这个双重检查吗？

因此，如果land1甚至存在，然后如果它确实存在，如果它不为空，则选中复选框。

提前感谢！

Answer 1

url.searchParams.get(key)如果找到给定的搜索参数，则返回一个字符串；否则为null。所以你可以简单地更新你的if条件，比如：

if (land1) {
land1_input.checked = true;
}

Answer 2

似乎您与条件词混淆了。重新表述你的问题，以更好地理解你的疑虑。

对下面的getCheckboxwaardes进行了更改：

function getCheckboxwaardes(){
var url_string = window.location.href;
var url = new URL(url_string);
var land1 = url.searchParams.get("land1");
var land1_input = document.getElementById('Nederland');
if (land1 === "land1") {land1_input.checked = true;}
if (land1 === "") {land1_input.checked = false;}
}

Answer 3

这将处理null、"、未定义和所有错误条件

and1_input.checked = land1 ? true : false

Answer 4

land1_input.checked = land1 ? true : false

Answer 5

试试这个，

function getCheckboxwaardes(){
const query = new URLSearchParams(window.location.search)
var land1_input = document.getElementById('Nederland');
land1_input.checked = query.get('land1') ? true : false;
}

它简单明了：(