js动态添加select菜单 联动菜单
原文发布时间为:2009-11-14 —— 来源于本人的百度文章 [由搬家工具导入]
<html>
<head>
<title>http://hi.baidu.com/handboy</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
<!--
body { font-size: 14px }
-->
</style>
</head>
<body bgcolor=#FFFFFF alink=#333333 vlink=#333333 link=#333333 topmargin=0 leftmargin=0>
<form>
<script language="javascript">
<!--
function LoandCity(provinceID)
{
switch (provinceID)
{
//
case "1":
//清空select
document.getElementById("city").options.length=0;
//添加SELECT 这个地方我们可以自己调用数据里面的数据
document.getElementById("city").options.add(new Option("宣武区","1"));
document.getElementById("city").options.add(new Option("海淀区","2"));
break
case "2":
document.getElementById("city").options.length=0;
document.getElementById("city").options.add(new Option("黄浦区","1"));
document.getElementById("city").options.add(new Option("闸北区","2"));
break
default:
alert("错误类型");
break
}
}
-->
</script>
<body>
<form name="form1" >
<select id="province" onChange = "LoandCity(this.value);">
<!--这个地方我们可以自己调用数据库里面的省份-->
<option value="1">北京</option>
<option value="2">上海</option>
</select> 城市 <select id="city" ></select><br>
<script type="text/javascript">LoandCity('1');</script>
</form>
</body>
</html>
可能会遇见一些问题,可以见这篇文章回发或回调参数无效 “HtmlSelect”不能有类型为“LiteralControl”的子级
=====================
1 检测是否有选中
if (objSelect.selectedIndex > - 1 ) {
// 说明选中
} else {
// 说明没有选中
}
2 删除被选中的项
objSelect.options[objSelect.selectedIndex] = null ;
3 增加项
objSelect.options[objSelect.length] = new Option( " 你好 " , " hello " );
4 修改所选择中的项
objSelect.options[objSelect.selectedIndex] = new Option( " 你好 " , " hello " );
5 得到所选择项的文本
objSelect.options[objSelect.selectedIndex].text;
6 得到所选择项的值
objSelect.options[objSelect.selectedIndex].value;
js动态添加select菜单 联动菜单的更多相关文章
- JS & JQuery 动态添加 select option
因为是转载文章 在此标明出处,以前有文章是转的没标明的请谅解,因为有些已经无法找到出处,或者与其它原因. 如有冒犯请联系本人,或删除,或标明出处. 因为好的文章,以前只想收藏,但连接有时候会失效,所以 ...
- 使用js动态添加组件
在文章开始之前,我想说两点 1 自己初学js,文章的内容在大神看来可能就是不值一提,但是谁都是从hello world来的,望高 手不吝指教# 2 我知道这个标题起的比较蛋疼,大家看图就能说明问题 ...
- JS动态改变select选择变更option的index值
document.getElementById("louyuming").options[0].selected=true; function jsSelectIsExitItem ...
- js动态添加onload、onresize、onscroll事件(另类方法)
js动态添加onload.onresize.onscroll事件(另类方法) window 的 onload.onresize.onscroll 事件,跟其他的事件不一样,它不能用 attachE ...
- form表单 无法提交js动态添加的表单元素问题。。
第一种情况, 这种情况js动态添加的表单元素是不能提交到服务器端的 <table> <form method="post" action=" url ...
- 【原生js】js动态添加dom,如何绑定事件
首先要明白浏览器在加载页面的时候是按顺序来加载的,这样以来就很清楚了,js动态添加dom以后,这些dom并没有绑定事件,这个时候最简单的一个办法就是:将绑定事件的方法封装到一个函数A中,在动态添加完d ...
- 原生JS动态添加和删除类
原生JS动态添加和删除类 由于需要, 给按钮组监听点击事件(要求用事件委托),当有一个按钮被点击时,相应的给该按钮添加一个类(激活类),其他没有点击的按钮就要移出该类 添加和和删除类有三种方法 首先等 ...
- MUI 里js动态添加数字输入框后,增加、减少按钮无效
numbox 的自动初化是在 mui.ready 时完成的mui 页面默认会自动初始化页面中的所有数字输入框,动态构造的 DOM 需要进行手动初始化.比如:您动态创建了一个 ID 为 abc 的数字输 ...
- 原生js动态添加style,添加样式
原生js动态添加style,添加样式 第一种 var style="[assign-url='"+str+"']{display:initial}"; var ...
随机推荐
- 深入理解java虚拟机读书笔记1--java内存区域
Java在执行Java程序的过程中会把它所管理的内存划分为若干个不同的数据区域.这些区域都有各自的用途.创建和销毁的时间,有一些是随虚拟机的启动而创建,随虚拟机的退出而销毁,有些则是与线程一一对应,随 ...
- Zabbix监控告警Lack of free swap space on Zabbix server解决办法
报错详情如下: 是因为Zabbix监控没有考虑虚拟主机的交换空间情况 解决办法修改配置 修改表达式内容:{Template OS Linux:system.swap.size[,pfree].last ...
- Python_列表、字典、字符串、集合操作
一.list Python内置的一种数据类型是列表:list.list是一种有序的集合,可以随时添加和删除其中的元素.对于list的操作,我们要学会增删改查. 查 我们可以直接索引查找,也可以通过切片 ...
- 短信验证码js
var isSmsSend = false; function clickButtona(obj){ var obj = $(obj); var mobile=$("input[name=m ...
- PHP 优化
来源:歪麦博客 https://www.awaimai.com/1050.html 1 字符串 1.1 少用正则表达式 能用PHP内部字符串操作函数的情况下,尽量用他们,不要用正则表达式, 因为其效率 ...
- A1083 List Grades (25)(25 分)
A1083 List Grades (25)(25 分) Given a list of N student records with name, ID and grade. You are supp ...
- JVM——自定义类加载器
)以上两种情况在实际中的综合运用:比如你的应用需要通过网络来传输 Java 类的字节码,为了安全性,这些字节码经过了加密处理.这个时候你就需要自定义类加载器来从某个网络地址上读取加密后的字节代码,接着 ...
- 1010: [HNOI2008]玩具装箱toy(斜率优化)
1010: [HNOI2008]玩具装箱toy Time Limit: 1 Sec Memory Limit: 162 MBSubmit: 12280 Solved: 5277[Submit][S ...
- json对象数据列数
// var len = data.length(); // alert(data.Rows.length); var colCount = (function count(){//一条记录中有几个键 ...
- jeakins+maven+jmeter构建性能测试自动化( 在eclipse里运行如果出现没有找到“*.loadtest.xls”,请将此文件名修改为你对应使用的xsl文件名)
背景: 首先用jmeter录制或者书写性能测试的脚本,用maven添加相关依赖,把性能测试的代码提交到github,在jenkins配置git下载性能测试的代码,配置运行脚本和测试报告,配置运行失败自 ...