javascript使用html中form表单中的select类建立级联菜单
来源:互联网 发布:手机淘宝 退货率 编辑:程序博客网 时间:2024/06/14 15:29
用例如下:
<form name="form1" method="POST" action="--WEBBOT-SELF--">
<select id="select1" onchange="select1onchange()">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</form>
我建议要设定每个option的value值,来标示用户在选用时具体是哪一项。
在javascript中使用document.getElementById("select1").value;或者form1.select1.value;
则可得到所选的值是多少。
使用onchange事件,触发条件是select的option值改变。
使用级联菜单时
建立两个select,他们的id分别是select1,select2。
为select1创建触发函数javascript函数,select1onchange(),在此函数中,得到select1的值,
查表得到相对应的select2的值,并为select2添加相应的选项,即可达到级联效果。
<select id="select1" onchange="select1onchange()">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
<select id="select2" onchange="select2onchange()">
</select>
function t1onfocus()
{
document.getElementById("p1").innerHTML="获得焦点";
}
function select1onchange()
{
var i;
for (i=10;i>=0;i--)
form1.select2.remove(i);
var objOption;
for (i=0;i<=9;i++)
{
objOption=document.createElement("OPTION");
objOption.text=form1.select1.value*10+i;
objOption.value=form1.select1.value*10+i;
form1.select2.options.add(objOption);
}
}
function select2onchange()
{
p1.innerHTML=form1.select2.value; //p1是文档中用于输出的自定义的项。
}
- javascript使用html中form表单中的select类建立级联菜单
- Html 中的form(表单)
- Html form <select>下拉列表菜单与跳转菜单表单标签篇
- html中form表单的使用实例
- JavaScript -- Input Select 操作, 级联菜单
- 黑马程序员-html之表单组件<form>,下拉菜单<select>,文本域<textarea>
- form表单中select组件使用for循环赋值
- rails中使用form.select创建动态的下拉菜单
- HTML+Javascript复制表格行并清空form表单input/select值.
- JavaScript中form表单问题
- 菜鸟学习中-html:form/html:select
- 使用Javascript完成文件操作、添加新项到HTML控件SELECT中、读取SELECT控件中的选定项
- HTML:form表单中的label标签
- 【Html】form表单中的label标签
- HTML:form表单总结,input,select,option,textarea,label
- javascript获取form表单中的字段值
- HTML中Form表单的method属性
- HTML中form表单作用解释
- 光线补偿
- NT缓存管理器(四)
- Fedora10安装Oracle10.2教程
- NT缓存管理器(五)
- Windows 的Cache管理器
- javascript使用html中form表单中的select类建立级联菜单
- Oracle JOB 用法小结(转载)
- 配置文件的使用
- C#注册窗体热键
- 知道我的头像是什么吗?
- c++中运算符重载遇到的问题
- Vista下的Shadow SSDT服务函数名表
- GIT 版本控制软件(二) 基础篇
- 聊聊软件与吃饭(二)- 谈谈甲方选择软件供应商必须要分析的几个问题