Question

一旦用户在文本框中输入内容，我就会有以下代码来检查复选框。这适用于单个文本框。

function activateCheckbox() {
        if (document.myForm.box1.checked == false) {
            document.myForm.box1.checked = true;
        }
    }
    <tr>
        <td><input type="text" id="mySearch1" name="mySearch1" size="40" onkeypress="activateCheckbox()"/></td>
        <td><input type="checkBox" id="box1" name="box1"/></td>
    </tr>

但是假设有多个文本框，每个文本框都有一个复选框，我希望只检查相应的复选框。我通过将参数传递给函数来修改上面的代码如下所示，但它不起作用，因为“document.myForm.id.checked”不起作用，因为它接受复选框名称而不是“id”。请建议是否有更好的替代方案或如何修改我的代码以使其正常工作？

function activateCheckbox(id) {
        if (document.myForm.id.checked == false) {
            document.myForm.id.checked = true;
        }
    }
    <tr>
        <td><input type="text" id="mySearch1" name="mySearch1" size="40" onkeypress="activateCheckbox('box1')"/></td>
        <td><input type="checkBox" id="box1" name="box1"/></td>
    </tr>
    <tr>
        <td><input type="text" id="mySearch2" name="mySearch2" size="40" onkeypress="activateCheckbox('box2')"/></td>
        <td><input type="checkBox" id="box2" name="box2"/></td>
    </tr>
    <tr>
        <td><input type="text" id="mySearch3" name="mySearch3" size="40" onkeypress="activateCheckbox('box3')"/></td>
        <td><input type="checkBox" id="box3" name="box3"/></td>
    </tr>

Answer 1

你有几个选择。你可以这样做：

function activateCheckbox(id) {
    if (document.myForm[id].checked == false) {
        document.myForm[id].checked = true;
    }
}

......或者就我个人而言，我认为这有点清楚：

function activateCheckbox(id) {
    var checkbox = document.getElementById(id);
    if (! checkbox.checked) {
        checkbox.checked = true;
    }
}

第一种方法有效，因为在JavaScript中obj.someProperty在语义上与obj["someProperty"]的意思相同。因此，如果您有一个存储要访问的属性名称的变量，则始终可以obj[name]访问该属性。

第二种方法是在id中找到DOM中的复选框。这对我来说似乎更干净，因为你正在设置每个复选框的id，因为你调用了你的变量“id”。

另请注意，您的if声明是多余的。 checked属性只会是true或false（您可以通过在其中存储其他内容来破坏它，但这是一个完全独立的主题）。因此，只要它是true，将其设置为false在逻辑上等同于始终将其设置为true，并且您可以使用单行实现处理函数，例如：

function activateCheckbox(id) {
    document.getElementById(id).checked = true;
}

Answer 2

.id字面意思是id属性。如果您想动态设置它，请使用[]表示法：

function activateCheckbox(id) {
        if (document.myForm[id].checked == false) {
            document.myForm[id].checked = true;
        }
    }

['test']表示.test，['abc']表示.abc。因此[id]表示：访问id具有的值作为其值的属性。

Answer 3

我建议你使用JQuery（www.jquery.com）。通过添加一个代码行

<script src="http://code.jquery.com/jquery-1.6.2.min.js" type="text/javascript"></script>

您只需编写一个代码行即可解决问题：

$('#checkboxId').attr('checked','checked');

或者您可以查看

$('input[type="checkbox"]').attr('checked','checked');

或unckeck

$('input[type="checkbox"]').attr('checked','');

您文档中的所有复选框

如何检查onkeypress上的复选框？

3 个答案: