标签：province arr javascript 用法 getElementById new document 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
标签：province,arr,javascript,用法,getElementById,new,document,options 来源： https://www.cnblogs.com/malala/p/15673396.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。