JavaScript数组不起作用，直接输入可以使用。

22 浏览
0 Comments

JavaScript数组不起作用，直接输入可以使用。

我有一个包含复选框的数组，这些值代表了我的网站上的复选框。

如果单击复选框，我希望对应的复选框标签变为蓝色。

我有一个可工作的点击函数，它工作得很完美，但只有在直接使用复选框名称时才有效（这是复选框名称 haustiere_erlaubt）：

$('#haustiere_erlaubt').click(function(){
    if(document.getElementById("haustiere_erlaubt").checked) {
        $("label[for=haustiere_erlaubt]").css("color", "#0d9eff");
    } else {
        $("label[for=haustiere_erlaubt]").css("color", "#b4b4b4");
    }
});

我网站上有多个复选框，使用数组更高效，因为我不想多次编写相同的代码。但是不知何故，它不起作用，尽管控制台显示正确的复选框名称：

var bool_checkboxes = ["haustiere_erlaubt", "bettwaesche_wird_gestellt", "grill_vorhanden", "safe_vorhanden", "kuehlschrank_vorhanden", "rauchen_erlaubt", "parkplatz_vorhanden",
                       "kochmoeglichkeit_vorhanden", "restaurant_im_haus_vorhanden", "handtuecher_werden_gestellt", "tv_vorhanden", "waschmoeglichkeit_vorhanden", "wlan_vorhanden"];
for (var bool_field = 0; bool_field < bool_checkboxes.length; bool_field++) {
    console.log(bool_checkboxes[bool_field]);
    $('#' + bool_checkboxes[bool_field]).click(function(){
        if(document.getElementById(bool_checkboxes[bool_field]).checked) {
            $("label[for=" + bool_checkboxes[bool_field] + "]").css("color", "#0d9eff");
        } else {
            $("label[for=" + bool_checkboxes[bool_field] + "]").css("color", "#b4b4b4");
        }
    });
}

当单击复选框时，我在控制台日志中收到以下错误消息：

Uncaught TypeError: Cannot read property 'checked' of null
at HTMLInputElement. (main.js:292)
at HTMLInputElement.dispatch (jquery.min.js:3)
at HTMLInputElement.r.handle (jquery.min.js:3)

0

2 答案

0 Comments

原因：JavaScript数组不起作用，直接输入有效。

解决方法：使用属性选择器。

文章内容如下：

如果在文档中没有重复的id元素，您可以使用属性选择器。

$("[id*='_']").on("click", function() {
  $(this.labels[0]).css("color", this.checked ? "#0d9eff" : "#b4b4b4");
})

以上是解决方法。

0
0 Comments

JavaScript数组不起作用，直接输入有效的问题可能是由于以下原因引起的：

1. 循环索引在闭包内部无法保持一致，导致无法正常使用。解决方法是使用this关键字，如上述示例代码所示。

2. 可能存在其他代码问题或语法错误导致数组无法正常工作。解决方法是检查代码中是否存在其他错误，并确保语法正确。

3. 可能存在未正确引入或初始化数组的问题。解决方法是确保数组已经正确引入并且已经初始化。

为了解决JavaScript数组不起作用的问题，可以尝试以下解决方法：

1. 使用this关键字来代替循环索引，以确保闭包内部的变量保持一致。

2. 检查代码中是否存在其他错误或语法问题，并进行修复。

3. 确保数组已经正确引入并且已经正确初始化。

通过以上解决方法，应该能够解决JavaScript数组不起作用的问题。如果问题仍然存在，可能需要进一步检查代码逻辑或寻求其他解决方案。

0