Question

基本上，我有一个包含多个选项的表单，每个选项都会过滤结果，直到您有特定的结果，它使用javascript来执行此操作。

我的问题是我在表单中有一个带有多个复选框的部分，我想要做的是检查每个复选框是否都被选中并在检查时显示一些数据。但是有多个人可以被检查。

我 cant 使用任何类型的框架所以请不要建议，并且我不需要任何大块代码（只有很好解释的代码），我需要这个向我解释，然后我可以编写自己的代码（所以我可以学习），我只是不知道如何去做这件事。

对所需Javascript的任何解释都会有所帮助。

编辑：这是我到目前为止的代码：

function jobs() {
    var shownursing = document.getElementById('nursing-block');

    if (document.getElementsByName("nursing")[0].checked) {
        console.log("hi")
        shownursing.style.display = 'block';
        return true;
    } else { 
        console.log("no")
        shownursing.style.display = 'none';
        return false;
    }
}

jobs();

Answer 1

基本上，您希望在选中复选框时发生某些功能，对吧？对此最好的选择是在选中复选框时编写一个函数（或一组函数）来调用。该功能将决定响应复选框显示的内容。

我认为您需要从代码中获得的关键区别是您需要将函数调用附加到要检查的复选框的操作。要在不使用jQuery或任何其他框架的情况下以这种方式附加函数，可以在复选框的html中包含onClick属性：

<input type="checkbox" id="ch1" onclick="jobs();" />

或者，如果您希望在单击按钮时执行该功能，则可以将其附加到该按钮的onclick。或者，如果您希望在页面加载时执行它，可以通过在函数外部包含以下代码来实现：

window.onload=jobs;

您还可以执行上述操作的组合，以便在页面加载时执行该功能，并在单击复选框或按钮时执行。

在jobs()中，您可以通过访问DOM元素并获取.checked属性来检查复选框的值。请注意，为每个复选框设置一个单独的ID并以此方式进行检查是更好的做法（从长远来看，您使用的数据远远少于使用{{{{{{{{{{ 1}}：

document.getElementsByName()

由于您要检查多个复选框，因此您将拥有多个此类if语句（假设它们是独立的）。如果需要将它们作为一个单元进行处理（即检查了两个复选框，而不仅仅是单独检查每个复选框的组合），那么您可以在这些if (document.getElementById("ch1").checked) { //take actions related to this checkbox being checked }语句中设置一些控制变量，然后在最后使用switch语句来控制最终的执行。

使用Javascript处理具有多个复选框的表单

1 个答案: