javascript当中options的用法

6.options
马克-to-win:选择列表
例 6.1(SelectOptionAddIEFF.html)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <TITLE>
    </TITLE>
    <SCRIPT LANGUAGE="JavaScript">
        <!--

        /* a typical value is that document.getElementById("province").options[1]="河北", document.getElementById("city").options[1]= arr[0][1]= "石家庄" */
        var arr = new Array(
                new Array("河北", "邯郸","石家庄"),
                new Array("山东", "济南", "枣庄", "威海"),
                new Array("河南", "开封", "郑州", "洛阳",  "南洋")
        );

        function setProvinces()
        {
            /* arr.length is the row number of arr, arr[i][0] the first column. in other words, 河北,山东,河南   */
            for (var i = 0; i < arr.length; i++)
            {   /*加到option最后,new Option(str1,str2)str1 是页面中看到的描述,而str2是这一项的值*/
                document.getElementById("province").options[i + 1] = new Option(arr[i][0], arr[i][0]);
            }
        }
        function setCity(i)
        {   alert(i+" "+document.getElementById("province").selectedIndex+document.getElementById("province").value+document.getElementById("province").options[document.getElementById("province").selectedIndex].text+document.getElementById("province").options[document.getElementById("province").selectedIndex].value);
            document.getElementById("city").options.length = 1;//reset city
            for (var j = 1; j < arr[i - 1].length; j++)
            {
                opt = new Option(arr[i - 1][j], arr[i - 1][j]);
                /*下面两种写法的结果是一样的*/
                //         document.getElementById("city").options[j] = new Option(arr[i - 1][j], arr[i - 1][j]);
                document.getElementById("city").add(opt,document.getElementById("city").options.length);//第二个参数指定元素放置所在的索引号
            }
//            objSelect.add(objOption, objSelect.selectedIndex);
        }
        //-->
    </SCRIPT>
</HEAD>

<BODY οnlοad="setProvinces()">
<!--Select.selectedIndex (Property)
qixy: through experiment: Select.selectedIndex is 0-based.但是第0项是“请选择省份-- ”
-->
<select name="select" id="province" οnchange="setCity(this.selectedIndex);">
    <option value="0">请选择省份--</option>
</select>
<select name="select2" id="city">
    <option value="0">请选择城市--</option>
</select>
</BODY>
</HTML>
 

更多内容请见原文,文章转载自:https://blog.csdn.net/qq_43650923/article/details/102467341

上一篇:JS 双向数据绑定、单项数据绑定


下一篇:React语法规则