用javascript自动填写表单

Autofill form completion in javascript

本文关键字：表单 javascript      更新时间：2024-01-08

我有一个调用javascript函数的复选框。选中此复选框后，表单中的其他值将自动填写。这些其他值的类型是另一个复选框和一个选项选择字段。我在html中有以下内容：

<div id="NA" >
<input type="checkbox" name="remove_cd" value="r_on" id="r_on_cd" />N/A:
<select name="reason" id="reason_list">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</select>
<font color="#cc0000">Reason Required</font><hr/></div>

在javascript中，我在一个函数中有以下内容：

...
var y = document.getElementById("NA").children;
for(var i=0; i<y.length; y++){
    y[i].checked=true;
    y[i].options.selectedIndex=2;
}
...

我有点困惑为什么这不起作用。当我单击表单中的复选框时，<div id="NA">下的复选框会被选中，但下拉列表中的选项不会更改。想法？

循环中有y++而不是i++。试试这个

for(var i=0; i<y.length; i++){
    y[i].checked=true;
    y[i].selectedIndex=2;
}

在options上调用.selectedIndex会抛出Cannot set property 'selectedIndex' of undefined

y[i].options.selectedIndex=2;

应该只读：

y[i].selectedIndex=2;

我不确定你到底想做什么，但试试这个：

<div id="NA" >
<input type="checkbox" name="remove_cd" value="r_on" id="r_on_cd" />N/A:
<select name="reason" id="reason_list">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</select>
<font color="#cc0000">Reason Required</font><hr/></div>
<script>
    window.onload = function() {
        var y = document.getElementById("NA").children; // it's not a good idea to use children array, because if you add a new element in the begining your script will fail
        var checkbox = y[0]; // it is better here to use: document.getElementById('r_on_cd');
        var select = y[1]; // it is better here to use: document.getElementById('reason_list');
        checkbox.onclick = function() {
            select.options.selectedIndex = 2;
        };
    }
</script>
相关文章：