select是HTML中from表单的一个下拉菜单，格式如下
<form action="" ><select name="" id="">
<option value="1">选项一</option>
<option value="2">选项二</option>
<option value="3">选项三</option>
<option value="4">选项四</option>
</select>
</form>
select是表单元素中下拉框，主要是用于将客户的选择项值，传递到后台，进行相应的返回
其中，value的值就是传递到处理文件的值，下面我们以两个文件为例
1）新建一个完整的表单（1.html），有select选项，分别设置不同的值传递，例如星期三，value对应的值是3
2）处理文件（2.html）
（备注，此处用html文件代替演示，实际中可以是js文件，php文件，或者是java后台等等
还可以根据用户的输入 *** 作数据库，例如用户登陆的时候的用户名和密码，表单提交，查询数据库，返回相应是否成功的界面）
3）运行1.html文件，选择星期三，选择提交
4）点击提交之后跳转到2.html文件
5）在浏览器的地址部分，可以看到s1=3的值
后台处理文件，可以获取这个值，根据程序约定，s1=3传递到后台就是客户选择了星期三，应对此做出对应的处理
总结：select的value值，主要是用作表单提交的时候，数据值的传递！
<!doctype html><html><head><meta charset="utf-8"><title>联动</title></head><body><select id="s1" onChange="move()"><!-- 根据id获取value，onchange（）触发函数move（）修改二级select的text值实现联动 --><option selected value="s1">-- 请选择 --</option>
<!--默认选中-->
<option value="SC">SC</option>
<option value="BJ">BJ</option>
<option value="TJ">TJ</option></select><select id="s2">
<option selected>-- 请选择 --</option>
<!--默认选中，动态生成option --></select><script>
function move()
{
var s1=document.getElementById("s1")var s2=document.getElementById("s2")<!-- 获取一级和二级的属性-->
var add
if(s1.value=="SC")
{
add=new Array("CD","DZ","MY","NC")<!--比对value值，实现对应二级text值的动态生成-->
}else if(s1.value=="BJ")
{
add=new Array("HD","CY","WFJ")<!--比对value值，实现对应二级text值的动态生成-->
}else if(s1.value=="TJ")
{
add=new Array("TJG","TJ","TJY")<!--比对value值，实现对应二级text值的动态生成-->
}else if(s1.value=="s1")
{
add=new Array("请选择")
}
else
{
add=null<!--若没有就为空，当然不可能出现的-->
}
s2.length=0
for(var i=0i<add.lengthi++) { var ss=new Option() ss.text=add[i].split()[0]
s2.add(ss)
<!--把text值添加到二级select中，显示出来-->
}
}</script></body></html>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）