Question

我想做什么

根据表单选择字段中选择的内容自动填充表单文本字段。

到目前为止我做了什么

以下代码在开发过程中完美运行：

第1步：填充数据数组

<script type="text/javascript">
var carcolorData = new Array();
carcolorData['Ford'] = 'Blue';
carcolorData['BMW'] = 'Green';
carcolorData['Fiat'] = 'Red';
carcolorData[''] = 'Hello';
</script>

第2步：我创建了一个典型的html表单，其中包含文本和选择字段：

<form>    
<select name="cartype" id="cartype" >
<option selected="selected"></option>
<option>Ford</option>
<option>BMW</option>
<option>Fiat</option>
</select>

<input name="carcolor" type="text" id="carcolor" />
</form>

第3步：我创建一个小的javascript函数来自动填充onchange：

<script type="text/javascript">
document.form.cartype.onchange = showColor;
function showColor() 
{
var obj_sel = document.form.cartype;
document.form.carcolor.value = carcolorData[obj_sel.value];
}
</script>

问题

在public_html上传后不再有效。无论我选择它，它都会显示“Hello”，这是我示例中与空白对应的颜色。我完全迷失了...代码是正确的，因为它在开发阶段工作正常。在public_html上传后，为什么它不再起作用？

可能的原因

我在想这个，但我可能远非真相......

不同版本的IE（？）
不同的开发参数（？）
与同一页面上的其他javascript冲突（？）
javascript在脚本中没有正确定位（？）

Answer 1

我认为应该是

document.forms

not document.form

要获取选择“cartype”，假设您只有一个表单，请使用：

document.forms[0].cartype

另外，您是否在＆lt; select？

之前缺少＆lt; form标签

Answer 2

更改此

<script type="text/javascript">
document.form.cartype.onchange = showColor;
function showColor() 
{
var obj_sel = document.form.cartype;
document.form.carcolor.value = carcolorData[obj_sel.value];
}
</script>

对此：

 <script type="text/javascript">
        var showColor = function ()
            {
                var myform = document.form; //maybe change this to match form with an id.
                var selected_cartype = myform.cartype.options[myform.cartype.selectedIndex].value; //better do this to get a select value
                myform.carcolor.value = carcolorData[selected_cartype];
            }
        document.form.cartype.onchange = showColor;
    </script>

HTML中还有另一个问题：select的选项没有值属性。

<select name="cartype" id="cartype" >
    <option selected="selected"></option>
    <option>Ford</option>
    <option>BMW</option>
    <option>Fiat</option>
</select>

到

<select name="cartype" id="cartype" >
    <option value="" selected="selected"></option>
    <option value="Ford">Ford</option>
    <option value="BMW">BMW</option>
    <option value="Fiat">Fiat</option>
</select>

在public_html上传后，Javascript onchange不再工作了

2 个答案: