JavaScript实际应用 简单二级联动菜单实现
分享一下我老师大神的人工智能教程!零基础,通俗易懂!http://blog.csdn.net/jiangjunshow
也欢迎大家转载本篇文章。分享知识,造福人民,实现我们中华民族伟大复兴!
今天需要一个联动菜单的功能,查看网上资料,基本实现。
<form name="frm">
<select name="s1" onChange="redirec(document.frm.s1.options.selectedIndex)">
<option selected>请选择</option>
<option value="1">脚本语言</option>
<option value="2">高级语言</option>
<option value="3">其他语言</option>
</select>
<select name="s2">
<option value="请选择" selected>请选择</option>
</select>
</form>
<script language="javascript">
//获取一级菜单长度
var select1_len = document.frm.s1.options.length;
var select2 = new Array(select1_len);
//把一级菜单都设为数组
for (i=0; i<select1_len; i++)
{
select2[i] = new Array();
}
//定义基本选项
select2[0][0] = new Option("请选择", " ");
select2[1][0] = new Option("PHP", " ");
select2[1][1] = new Option("ASP", " ");
select2[1][2] = new Option("JSP", " ");
select2[2][0] = new Option("C/C++", " ");
select2[2][1] = new Option("Java", " ");
select2[2][2] = new Option("C#", " ");
select2[3][0] = new Option("Perl", " ");
select2[3][1] = new Option("Ruby", " ");
select2[3][2] = new Option("Python", " ");
//联动函数
function redirec(x)
{
var temp = document.frm.s2;
for (i=0;i<select2[x].length;i++)
{
temp.options[i]=new Option(select2[x][i].text,select2[x][i].value);
}
temp.options[0].selected=true;
}
</script>
执行效果比较满意,下一步就是实现如何动态的加入数据库数据。
参考内容:http://www.blueidea.com/bbs/NewsDetail.asp?id=529631
给我老师的人工智能教程打call!http://blog.csdn.net/jiangjunshow
JavaScript实际应用 简单二级联动菜单实现相关推荐
- 二级联动菜单,简单实现
/*** jQuery Linkage Menu** Copyright 2014, sunyingyuan* QQ: 1586383022* Email: yingyuansun@163.com** ...
- HTML实现二级联动下拉菜单,基于jquery的二级联动菜单实现代码
jQuery 1.3.2 简单实现select二级联动 jQuery 二级联动 $(document).ready(function(){ $("#province").chang ...
- C#:二级联动菜单的实现
二级联动菜单,顾名思义,即一个菜单的变化会自动触发另一个相关联菜单的变化. 举个简单的例子,第一个菜单显示"北京",第二菜单会相应绑定列表"海淀区"," ...
- asp+ajax菜单,AJAX_基于asp+ajax和数据库驱动的二级联动菜单,index.asp 页面代码 复制代码 代 - phpStudy...
基于asp+ajax和数据库驱动的二级联动菜单 index.asp 页面代码 复制代码 代码如下: set cmd = conn.execute("select bigclassid,big ...
- 前端:JS/35/二级联动菜单,select对象,select对象的属性,option对象,option对象属性,实例:省份列表与城市列表的联动
二级联动菜单 select 对象 一个<select>标记,对应一个select对象: select对象的属性 1,options[] :设置或返回下拉列表中<option>标 ...
- JS省市二级联动菜单,sky整理收集。
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- php几级栏目联动,php实现二级联动菜单
php实现二级联动菜单 php实现二级联动菜单的方法:首先根据大类的值,通过jQuery把值传给后台PHP处理:然后用PHP查询MySQl数据库,得到相应的小类:最后返回JSON数据给前端处理即可. ...
- 二级联动菜单ajax刷新,jquery json ajax 二级联动菜单实例
本文实例讲述了jquery json ajax 二级联动菜单.分享给码农们参考,具体如下: 后台Handler.ashx using System; using System.Web; using S ...
- 分类二级联动 php,学习猿地-php实现二级联动菜单
php实现二级联动菜单的方法:首先根据大类的值,通过jQuery把值传给后台PHP处理:然后用PHP查询MySQl数据库,得到相应的小类:最后返回JSON数据给前端处理即可. jq+php+mysql ...
最新文章
- C语言程序流程设计之跳转【程序流程设计】(14)
- /etc/resolv.conf root用户下不能修改
- apache的斜杠问题
- concat与concat_ws区别
- 我的docker随笔:开篇
- 使用monkey 前准备工作
- 重构-使代码更简洁优美:实际经验之谈(提供一技巧,让你省掉N多代码)
- (十)unity4.6学习Ugui中文文档-------參考-UGUI Canvas Components
- 基站的小区号256变换
- 有关单片机驱动IR2104遇到的问题及解决方法
- 7-4 计算职工工资(15分)
- 网络其他计算机无法访问,win7局域网别人无法访问我的电脑是为什么_win7其他电脑无法访问我的电脑如何修复-win7之家...
- 深入了解Linux内核MMU管理机制
- 【Matlab】系统的响应分析
- 2021-11-13周报
- holder.js占位图片生成器
- Java堆排序(大顶堆小顶堆及应用实例)
- oracle sun小机处理器,浅析IBM、HP和Sun新一代小型机竞争格局
- 画图技巧 : Matlab调用Origin作图
- QCOM camera架构
热门文章
- 使用Python爬取“最好大学网”软科中国最好大学排名2019并做可视化分析
- 微信小程序部分知识点总结
- 西南交通大学教务网课程评价自动填充插件
- Github测试连接时报错“The authenticity of host ‘github.com‘can‘t be established.“RSA key fingerprint解决办法
- 苹果手机html5摇一摇游戏戏码,利用HTML5的devicemotion事件实现手机摇一摇抽奖,年会抽奖,html5devicemotion...
- 区块链将怎样影响游戏行业
- 三星530换固态硬盘_固态硬盘大对比,给想换固态硬盘的朋友们的建议!
- 滴滴快车奖励政策,高峰奖励,翻倍奖励,按成交率,指派单数分级(4月15日)...
- github网址能ping通,但是浏览器访问不了
- 中国CDN市场厂商排名:阿里云稳居第一,腾讯云第三