简单JS多级下拉框无刷新
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>小灰</title>
</head>
<body>
<form name="form1" method="post">
<select id="s1" name="s1"></select><select id="s2" name="s2"></select><select id="s3" name="s3"></select><select id="s4" name="s4"></select>
</form>
<script language="JavaScript">
<!--
function LianDong(arr, sel)
{
var me = this;
this.$ = function(o)
{
return document.getElementByIdx(o);
}
this.sub = function (i, pid)
{
for (var j=i+1; j<sel.length; j++)
{
me.$(sel[j]).length = 0;
me.$(sel[j]).options[0] = new Option("请选择", "");
}
for ( var j = 0; j < arr.length; j++)
{
if (arr[j][1] == pid)
{
me.$(sel[i+1]).options[me.$(sel[i+1]).length] = new Option(arr[j][2], arr[j][0]);
}
}
}
this.init = function()
{
me.sub(-1,"root");
for (var i=0; i<sel.length-1; i++)
{
me.$(sel[i]).onchange = function()
{
var i;
for (i=0; me.$(sel[i])!=this; i++);
me.sub(i, me.$(sel[i]).value);
}
}
}
this.init();
}
var array=new Array();
array[0]=new Array("华南地区","root","华南地区");
array[1]=new Array("华北地区","root","华北地区");
array[2]=new Array("上海","华南地区","上海");
array[3]=new Array("广东","华南地区","广东");
array[4]=new Array("徐家汇","上海","徐家汇");
array[5]=new Array("普托","上海","普托");
array[6]=new Array("广州","广东","广州");
array[7]=new Array("湛江","广东","湛江");
array[8]=new Array("湛江1","湛江","湛江1");
array[9]=new Array("湛江2","湛江","湛江2");
array[10]=new Array("广州1","广州","广州1");
array[11]=new Array("广州2","广州","广州2");
var select = new Array("s1","s2","s3","s4");
var liandong=new LianDong(array, select)
//-->
</script>
</body>
</html>
简单JS多级下拉框无刷新的更多相关文章
- avalon.js 多级下拉框实现
学习avalon.js的时候,有一个多级下拉框的例子,地址 戳这里 代码实现了联动, 但是逻辑上面理解有点难度,获取选择的值 和 页面初始化 功能存在问题. 在写地图编辑的时候,也用到了多级下拉框,特 ...
- jQuery Ajax实现下拉框无刷新联动
HTML代码: @{ Layout = null; } @using DAL; @using System.Data; @{ AreaDal areaDal = new AreaDal(); stri ...
- JS模拟下拉框select
最近做的一个项目有下拉框 同事都是用的是美化控件,但是用美化控件当然是好 但是网上找的一个控件不知道扩展性怎么样?对以后的维护会不会造成有影响?比如我想增加一个功能或者减少一个功能会不会影响?还有就是 ...
- JS 实现下拉框去重
JS 实现下拉框去重 学习内容: 需求 总结: 学习内容: 需求 用 JS 下拉框去重 实现代码 <html> <head> <meta http-equiv=" ...
- JS 实现下拉框回显
JS 实现下拉框回显 学习内容: 需求 总结: 学习内容: 需求 用 JS 实现下拉框回显 实现代码 <!DOCTYPE html> <html lang="en" ...
- Js获取下拉框选定项的值和文本
Js获取下拉框的值和文本网上提供了2种方法:但有些人很不负责任,他们根本没考虑到浏览器之间的差异导致的错误,导致很多新手琢磨了半天找不出错误! 下面我总结下Firefox和IE下获取下拉框选定项的值和 ...
- js改变下拉框内容
js改变下拉框内容 CreateTime--2018年4月8日18:47:38 Author:Marydon 适用场景:通常情况下,级联菜单.通过ajax异步获取后台数据改写下拉框内容会有这种需求 ...
- JS实现下拉框选中不同的项，对应显示不同的信息
实现的效果如下图: 页面代码 下拉框: <select id="select3" name="select3" onchange="showli ...
- 快速解决js开发下拉框中blur与click冲突
在开发中我们会经常遇到blur和click冲突的情况.下面叙述了开发中常遇到的"下拉框"的问题,并提供了两种解决方案. 一.blur和click事件简述 blur事件:当元素失去焦 ...
随机推荐
- （转）介绍几个C#正则表达式工具
推荐三个C#正则表达式工具,理由如下 第一个C#正则表达式工具,REGEX 这个C#正则表达式工具优点是中文的,提供了一些示例 第二个C#正则表达式工具,REGEXBUDDY 这是一个真正专业的REG ...
- 使用Uploadify 时，同时使用了jQuery.Validition 验证控件时，在IE11上出现JS缺少对象错误。
场景: 使用jQuery.1.8.2 使用 Uploadify 3.2上传控件 使用jQuery.Validition 1.9 验证 使用IE 11 时,当鼠标点击上传按钮时,会出现JS 缺少对象错误 ...
- COM 浅谈
ArcObject 是基于 COM(Microsoft Component Object Model),即组件对象模型.虽然ArcGIS的终端用户不用理解什么是COM,但是作为基于ArcObject的 ...
- uva 352 - The Seasonal War
題意: 要確認畫面中有幾隻Eagles,每個pixel如果是'1'代表為一隻Eagles,但上下左右(包含斜角共8個方向)相連的'1'只能算是同一隻. 想法: 使用DFS找'1'有幾個區域. #inc ...
- 微信支付：redirect_uri参数错误 的解决办法
redirect_url参数错误: 报这个错误,说明你的公众号后台授权设置有问题(一般有两处) 一:检查授权目录 答:支付授权目录是网站发起请求的页面所在目录,并且必须是能通过url地址访问的(与真实 ...
- git使用笔记（三）（图文说明） 图解提交更改内容的不同方式，涉及代码
此步之前的工作和示例请参考以下帖子: git使用笔记(一)Git的下载与配置 git使用笔记(二) 如何把GitHub上项目同步到本地 -------------------------------- ...
- js禁止默认的右键菜单或出现自定义右键菜单
1.屏蔽默认的右键菜单 js: document.getElementById('myimg').oncontextmenu=function(){return false;} jquery: $(' ...
- win7 删除服务
以管理员身份运行命令行工具. 输入 sc delete "服务名" 如若服务名有特殊字符需要加引号. sc dekete apache_pn
- 消息机制2 - Windows程序设计（SDK）005
消息机制2 让编程改变世界 Change the world by program 内容节选: 关于消息机制,还有三点需要补充: 消息队列是FIFO的形式 WM_PAINT,WM_TIMER 和 WM ...
- C语言初学 比较五个整数并输出最大值和最小值1
#include<stdio.h> #include<math.h> int max(int x,int y) { if(x>y) return x; else retu ...