Question

我有一个带有复选框的表单，这些表单是动态填充的，结果如下所示：

<input type="checkbox" name="1-subject" value="Option A" class="check" id="id_1-subject_0">
<input type="checkbox" name="1-subject" value="Option B" class="check" id="id_1-subject_1">
<input type="checkbox" name="1-subject" value="Other:" class="check" id="id_1-subject_2">

<input type="text" name="1-subject_other" id="id_1-subject_other" class="text" onkeyup="Test();" >

如果我需要自动检查“其他：”复选框，如果在文本字段中输入了任何内容，我可以这样做：

<script>
function Test(){
    var a = document.getElementById("id_1-subject_other");
    var b = document.getElementById("id_1-subject_2");
    if (!a) {
        b.checked=true;
    }
}
</script>

但是，如果添加了其他选项，则“其他：”复选框将更改为id_1-subject_3。如何通过动态更改ID作为var b来获取此字段？或者我可以获得'其他：'的价值吗？

Answer 1

由于“其他：”输入的值不会改变，您可以使用：

document.querySelector('input[value="Other:"]')

并获取元素。

Answer 2

您可以在keyup事件中使用dom获取document.querySelector('input[name=other]')。

Document方法querySelector（）返回文档中与指定选择器或选择器组匹配的第一个Element。如果未找到匹配项，则返回null。

<强>样本

function Test(el){
  document.querySelector('input[name=other]').checked= el.value!='';
}

<input type="checkbox" name="1-subject" value="Option A" class="check" id="id_1-subject_0"><label>A</label><br>
<input type="checkbox" name="1-subject" value="Option B" class="check" id="id_1-subject_1"><label>B</label><br>
<input type="checkbox" name="other" value="Other:" class="check" id="id_1-subject_2"><label>Other</label><br>

<input type="text" name="1-subject_other" id="id_1-subject_other" class="text" onkeyup="Test(this);">

Answer 3

您可以使用jQuery按值执行此操作。

$("input[type=checkbox][value='Other:']").prop("checked",true);

如何获取具有动态ID的表单元素 - 需要获取具有最高ID的元素

3 个答案: