关于select下拉框的问题

<head>
<script type="text/javascript"> function sltShow()
{
    inter1.style.display="none";
    inter2.style.display="none";
    inter3.style.display="none"; eval("inter"+inter0.value*1+".style.display='inline'");
}
</script>
</head>
<Select name="inter0"  onchange="sltShow()">
<Option value="1">在线</Option>
<Option value="2">不在线</Option>
<Option value="3">游离</Option>
</Select><Select name="inter1" >
<Option value="red">红色</Option>
<Option value="blue">蓝色</Option>
</Select><input type="text" name="inter2"  style="display:none" />
<input type="text" name="inter3"  style="display:none" />
<br/>
<input type="submit" name="submit" value="查询" />
我想做这么一个效果，代码如上可以实现，但接着我想把下拉框和文本框放在一个form表单内，用action属性把取得form表单里的值传给一个php文件处理，于是我做了如下修改：
<head>
<script type="text/javascript"> function sltShow()
{
    inter1.style.display="none";
    inter2.style.display="none";
    inter3.style.display="none"; eval("inter"+inter0.value*1+".style.display='inline'");
}
</script>
</head><form action="a.php" method="post"><Select name="inter0"  onchange="sltShow()">
<Option value="1">在线</Option>
<Option value="2">不在线</Option>
<Option value="3">游离</Option>
</Select><Select name="inter1" >
<Option value="red">红色</Option>
<Option value="blue">蓝色</Option>
</Select><input type="text" name="inter2"  style="display:none" />
<input type="text" name="inter3"  style="display:none" />
<br/>
<input type="submit" name="submit" value="查询" /></form>
但是这样修改后，刚才的js效果就没有了，比如inter0从在线状态改为不在线，无法隐藏inter1让inter2显现出来，把<form>
</form>标签去掉就能恢复js效果，请问我该如何更改这个程序才能把inter0，inter1，inter2,inter3放在一个form表单内，用action属性把取得form表单里的值传给a.php文件而且js效果不变

解决方案 »

  1.   

    selectedIndex是返回下拉列表中被选选项的索引号。 你用这个属性会方便的多。
      

  2.   

    document.getElementsByName("inter1")[0].style.display="none";
    document.getElementsByName("inter2")[0].style.display="none";
    document.getElementsByName("inter3")[0].style.display="none";
    试试吧，也许能帮到你。
      

  3.   

    <head>
    <script type="text/javascript">function sltShow(o)
    {
    var form=document.getElementById('myform');form.elements['inter1'].style.display="none";
    form.elements['inter2'].style.display="none";
    form.elements['inter3'].style.display="none";form.elements['inter'+o.value].style.display="inline";
    //eval("inter"+inter0.value*1+".style.display='inline'");
    }
    </script>
    </head><form action="a.php" method="post" id="myform"><Select name="inter0" onchange="sltShow(this)">
    <Option value="1">在线</Option>
    <Option value="2">不在线</Option>
    <Option value="3">游离</Option>
    </Select><Select name="inter1" >
    <Option value="red">红色</Option>
    <Option value="blue">蓝色</Option>
    </Select><input type="text" name="inter2" style="display:none" />
    <input type="text" name="inter3" style="display:none" />
    <br/>
    <input type="submit" name="submit" value="查询" /></form>
      

  4.   

    你如果只想改动js的话：
    <script type="text/javascript">
    function sltShow()
    {
        document.getElementsByName("inter1")[0].style.display="none";
        document.getElementsByName("inter2")[0].style.display="none";
        document.getElementsByName("inter3")[0].style.display="none";
        var v = document.getElementsByName("inter0")[0].value;
        document.getElementsByName("inter"+v+"")[0].style.display="inline";
    }
    </script>
    否则，请参考5 楼 的朋友写的