Javascript下拉列表选中的值在IE中不起作用

时间:2013-05-15 13:39:35

标签: javascript

我有一个javascript switch case语句来重定向页面或显示/隐藏文本框取决于用户从下拉框值中选择的内容。它在Firefox中运行良好但不是IE。错误消息如下: SCRIPT5007:无法获取属性“value”的值:object为null或undefined _index.htm,第67行7字符

switch(document.form.description.options [description.selectedIndex] .value) - IE使用form.desciprition很难。

<script language="javascript">
 function fundsource()
   {
       var val;


       for (i=0; i< document.form.description.length; i++)
       {

            switch (document.form.description.options[description.selectedIndex].value)

            {
                case "Select":
                    document.form.scholarship.style.visibility='hidden';
                    document.form.description_other.style.visibility='hidden';
                    break;
                case "Wall of Friends":
                    location.href= some url
                    break;
                case "Scholarship":
                    document.form.scholarship.style.visibility='visible';


                    break;
                case "Other":
                    document.form.description_other.style.visibility='visible';
                    document.getElementById("descriptionspan").style.visibility="visible";
                    break;


            }
       }
   }
</script>

html代码如下:

<tr>
                    <td align="right">Description of the Fund for Your Donation <br /></td>
                    <td>

        <select name="description" id="description" onchange="fundsource()">
                        <option>Select</option>
                        <option>Scholarship</option>
                        <option>Rainbow of Life</option>
                        <option>Wall of Friends</option>
                        <option>General</option>
                        <option>Other</option>

                    </select>
                    <select name="scholarship" id="scholarship" style="visibility:hidden;">
                        <option>Alumni Scholarship</option>
                        <option>Other</option>
                    </select>
                    </td>
                  </tr>
                   <tr>
                    <td align="right" valign="top"><div id="descriptionspan" alt="description" style="visibility:hidden;">Other, please specify:</div></td>
                    <td><input type="text" name="description_other" size="50" alt="Fund Other" style="visibility:hidden;" /></td>
                  </tr>

我将document.form.description.options [description.selectedIndex] .value更改为document.form.description.options [description.selectedIndex] .text,但它仍然不起作用。请指教。 TIA。

3 个答案:

答案 0 :(得分:1)

如果您打算使用

document.getElementById("description").value

在您的开关案例中,您必须为选项标签添加“值”属性,例如

<option value="Scholarship">Scholarship</option>

此代码也不必处于for循环中,您只需执行

即可
function fundsource() {
   var val = document.getElementById("description").value;
        switch (val) {
            case "Select":
                document.form.scholarship.style.visibility='hidden';
                document.form.description_other.style.visibility='hidden';
                break;
            case "Wall of Friends":
                location.href= some url
                break;
            case "Scholarship":
                document.form.scholarship.style.visibility='visible';
                break;
            case "Other":
                document.form.description_other.style.visibility='visible';
                document.getElementById("descriptionspan").style.visibility="visible";
                break;
        }
 }

希望这有帮助。

答案 1 :(得分:0)

你应该做这样的事情

    function fundsource()
       {
           var val;
           var form=document.getElementByID("formID");
           var description=getElementByID("description");

//why for loop?
           //for (i=0; i< description.options.length; i++)
           //{

                switch (description.value)

                {
                    case "Select":
                        //get option and change it's attr
                        break;
                    case "Wall of Friends":
                        //get option and change it's attr
                        break;
                    case "Scholarship":
                        //get option and change it's attr

                        break;
                    case "Other":
                        //get option and change it's attr
                        break;


                }
           //}
       }

答案 2 :(得分:0)

据我所知,即是怪物,你应该输入更多的词来让它知道

1.更改您的js代码:

switch (document.form.description.options[description.selectedIndex].value)

switch (document.form.description.options[document.form.description.selectedIndex].value)

2.更改您的HTML代码

<option>Select</option>
<option>Scholarship</option>
<option>Rainbow of Life</option>
<option>Wall of Friends</option>
<option>General</option>
<option>Other</option>

<option value="Select">Select</option>
<option value="Scholarship">Scholarship</option>
<option value="Rainbow of Life">Rainbow of Life</option>
<option value="Wall of Friends">Wall of Friends</option>
<option value="General">General</option>
<option value="Other">Other</option>

如果您不想添加属性value,则应将js .value更改为.innerText