html中select结合js的使用简介

来源：互联网发布：linux lamp一键安装包编辑：程序博客网时间：2024/05/14 21:41

//作用:
1.提供select的拷贝;
2.选择select1时动态选择添加select2中的值(值来源于:selectTotal).
//addedby: xufl
//addeddate:20070706
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<script type="text/javascript">

</script>
</HEAD>

<BODY>
<form name="musicForm">
<strong>Select Copy</strong><hr>
Select1:
<select id="select1" onChange="selectV()">
<option value="">
<option value="key1">key1text
<option value="key2">key2text
<option value="key3">key3text
<option value="key4">key4text
</select>
<p>
Select2:
<select id="select2">
</select>
<p>
<input type="button" value="Copy Select's Options" onClick="copy()">
<p>

<!--
div层使用说明:

　div的visibility可以控制div的显示和隐藏，但是隐藏后页面显示空白:

　　style="visibility: none;"

　　document.getElementById("typediv1").style.visibility="hidden";//隐藏

　　document.getElementById("typediv1").style.visibility="visible";//显示

　　通过设置display属性可以使div隐藏后释放占用的页面空间，如下

　　style="display: none;"

　　document.getElementById("typediv1").style.display="none";//隐藏

　　document.getElementById("typediv1").style.display="";//显示

-->
<div style="visibility: hidden;">
<select id="selectTotal" >
<option value="key1.1">key1.text1
<option value="key2.1">key2.text1
<option value="key3.1">key3.text1
<option value="key4.1">key4.text1
<option value="key1.2">key1.text2
<option value="key2.2">key2.text2
<option value="key3.2">key3.text2
<option value="key4.2">key4.text2
<option value="key1.3">key1.text3
<option value="key2.3">key2.text3
<option value="key3.3">key3.text3
<option value="key4.3">key4.text3
</select>
</div>
</form>
</BODY>
</HTML>