html部分代码为下拉列表添加onchange事件
<div class="form-group" style="margin-right: 0">
<label for="inputEmail3" class="col-sm-3 control-label" style="width: 170px; padding-top: 0">制造厂商:</label>
<div class="col-sm-5">
<select name="factory" id="select" class="form-control post_select" onchange="page.change(this.value);">
<c:forEach items="${list}" var="item" >
<option value="${item.manufacturerId}">${item.manufacturerName}</option>
</c:forEach>
</select>
</div>
</div>
<div class="form-group" style="margin-right: 0">
<label for="inputEmail3" class="col-sm-3 control-label" style="width: 170px; padding-top: 0">型号规格:</label>
<div class="col-sm-5">
<select name="model" id="model" class="form-control post_select" >
</select>
</div>
</div>
jQuery部分代码，还需要在页面初始化的时候就调用该方法加载一遍
var manufacturerId = $("#select").val();
page.change(manufacturerId);
page.change=function(manufacturerId){
$.ajax({
url:"${ctx }/psdj/change",
type:'get',
async:true,
cache:false,
data:{
"id":manufacturerId
},
success:function(data){
var items = data.model;
var selectModel = $("#model");
selectModel.empty();
if(items!=null){
for(var i in items){
var item = items[i];
selectModel.append(""+item.modelName+"");
$("#model").val('${vo.model}');
}
}
else{
selectModel.empty();
}
}
});
}
如果需要第二个下拉列表回显值，则需要在
数组或者ajax，都可以，如果是地区的网上有下载的https://www.cnblogs.com/maderlzp/p/7687161.html
https://www.jb51.net/article/115492.htm
1，用2个Select ，配合JS脚本实现联动；
<!DOCTYPE html>
Insert title here function fn(){ var select=document.getElementById("city"); var c=select.value; var area=document.getElementById("area"); switch(c) { case "jx": area.innerHTML="<option>抚州市</option><option>南昌市</option><option>赣州市</option><option>宜春市</option>"; break; case "gd":area.innerHTML="<option>广州市</option><option>韶关市</option><option>佛山市</option><option>东莞市</option>"; break; case "fj":area.innerHTML="<option>泉州市</option><option>厦门市</option><option>福州市</option><option>漳州市</option>"; break; case "hn":area.innerHTML="<option>长沙市</option><option>湘潭市</option><option>乐昌市</option><option>郴州市</option>"; break; default:alert("error"); } };
江西
广东
福建
湖南
抚州市
南昌市
赣州市
宜春市
好久没写代码了，文字逻辑回答下：
第一步：写两个select组件，一个命名id为省级select组件，一个命名id为地市级select组件；
第二步：在省级select 组件中增加onchange事件；
第三步：在引入的js文件或javascript脚本处编写 onchange调用的事件脚本，在方法体中实现地市级select组件的组装，可组装静态（纯页面文字）的option组件，也可根据Ajax方法组装动态（数据库读取）的option组件。
https://blog.csdn.net/w172087242/article/details/51077046
可以参考一下，里面有个下载demo的，可以直接参考使用
希望可以帮到你....
<br> function setM(){<br> //利用js代码向下拉框添加选项<br> var sel = document.getElementById("m");<br> //循环12次，添加上1-12月份<br> //创建一个option<br> for(var i=1;i<=12;i++){<br> var opt =new Option(i+"月份",i);//2个参数，第一个是text,value<br> sel.add(opt);<br> }<br> }<br> function setDate(m){<br> console.log(m);<br> //得到该月的日期<br> var date =31;<br> //得到日期下拉框<br> var sel = document.getElementById("d");<br> //对日期变量进行遍历<br> for(var i=1;i<=date;i++){<br> var opt = new Option(i+"号",i);<br> sel.add(opt);<br> }<br> }<br>
月份：
</select><br>
日期：<select id="d"></select>
<script>
setM();
setDate(document.getElementById("m").value)
</script>
</body>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
function setM(){
//利用js代码向下拉框添加选项
var sel = document.getElementById("m");
//循环12次，添加上1-12月份
//创建一个option
for(var i=1;i<=12;i++){
var opt =new Option(i+"月份",i);//2个参数，第一个是text,value
sel.add(opt);
}
}
function setDate(m){
console.log(m);
//得到该月的日期
var date =31;
//得到日期下拉框
var sel = document.getElementById("d");
//对日期变量进行遍历
for(var i=1;i<=date;i++){
var opt = new Option(i+"号",i);
sel.add(opt);
}
}
</script>
</head>
<body>
月份：<select id="m" onchange="setDate(this.value)">
</select><br>
日期：<select id="d"></select>
<script>
setM();
setDate(document.getElementById("m").value)
</script>
</body>
</html>
- 其他相关推荐
- 学会了这些技术，你离BAT大厂不远了
- 每一个程序员都有一个梦想，梦想着能够进入阿里、腾讯、字节跳动、百度等一线互联网公司，由于身边的环境等原因，不知道 BAT 等一线互联网公司使用哪些技术？或者该如何去学习这些技术？或者我该去哪些获取这些技术资料？没关系，平头哥一站式服务，上面统统不是问题。平头哥整理了 BAT 等一线大厂的必备技能，并且帮你准备了对应的资料。对于整理出来的技术，如果你掌握的不牢固，那就赶快巩固，如果你还没有涉及，现在...
- 程序员真是太太太太太有趣了！！！
- 网络上虽然已经有了很多关于程序员的话题，但大部分人对这个群体还是很陌生。我们在谈论程序员的时候，究竟该聊些什么呢？各位程序员大佬们，请让我听到你们的声音！不管你是前端开发...
- 史上最详细的IDEA优雅整合Maven+SSM框架（详细思路+附带源码）
- 网上很多整合SSM博客文章并不能让初探ssm的同学思路完全的清晰，可以试着关掉整合教程，摇两下头骨，哈一大口气，就在万事具备的时候，开整，这个时候你可能思路全无 ~中招了咩~ ，还有一些同学依旧在使用eclipse或者Myeclipse开发，我想对这些朋友说IDEA 的编译速度很快，人生苦短，来不及解释了，直接上手idea吧。这篇文章每一步搭建过程都测试过了，应该不会有什么差错。本文章还有个比较优秀的特点，就是idea的使用，基本上关于idea的操作都算是比较详细的，所以不用太担心不会撸idea！最后，本文
- 我花了一夜用数据结构给女朋友写个H5走迷宫游戏
- 起因 又到深夜了，我按照以往在csdn和公众号写着数据结构！这占用了我大量的时间！我的超越妹妹严重缺乏陪伴而 怨气满满！ 而女朋友时常埋怨，认为数据结构这么抽象难懂的东西没啥作用，常会问道：天天写这玩意，有啥作用。而我答道：能干事情多了，比如写个迷宫小游戏啥的！ 当我码完字准备睡觉时：写不好别睡觉！ 分析 如果用数据结构与算法造出东西来呢？ ...
- 接班马云的为何是张勇？
- 上海人、职业经理人、CFO 背景，集齐马云三大不喜欢的张勇怎么就成了阿里接班人？ 作者|王琳 本文经授权转载自燃财经（ID:rancaijing） 9月10日，张勇转正了，他由阿里巴巴董事局候任主席正式成为阿里巴巴董事局主席，这也意味着阿里巴巴将正式开启“逍遥子时代”。 从2015年接任CEO开始，张勇已经将阿里巴巴股价拉升了超过200%。但和马云强大的个人光环比，张勇显得尤其...
- 让程序员崩溃的瞬间（非程序员勿入）
- 今天给大家带来点快乐，程序员才能看懂。 来源：https://zhuanlan.zhihu.com/p/47066521 1. 公司实习生找 Bug 2.在调试时，将断点设置在错误的位置 3.当我有一个很棒的调试想法时 4.偶然间看到自己多年前写的代码 5.当我第一次启动我的单元测试时 ...
- 接私活必备的 10 个开源项目！
- 点击蓝色“GitHubDaily”关注我加个“星标”，每天下午 18:35，带你逛 GitHub！作者 | SevDot来源 | http://1t.click/VE8W...
- Spring高级技术梳理
- Spring高级技术梳理 序言正文SpringDate部分Spring全家桶之SpringData——预科阶段Spring全家桶之SpringData——Spring 整合Hibernate与Hibernate JpaSpring全家桶之SpringData——Spring Data JPASpring全家桶之SpringData——SpringData RedisSpringBoot部分Sp...
- 如何在Windows中开启"上帝模式"
- 原文链接 : https://mp.weixin.qq.com/s?__biz=MzIwMjE1MjMyMw==&mid=2650202982&idx=1&sn=2c6c609ce06db1cee81abf2ba797be1b&chksm=8ee1438ab996ca9c2d0cd0f76426e92faa835beef20ae21b537c0867ec2773be...
- 飞天智能：阿里云的 AI 落地野心
- 当下，AI 业界不会否认的一个事实是，AI实力的比拼不再是单点的算法技术能力，而是从底层算法到应用平台的全面AI能力。单纯的算法，只是实验室里的乐趣，唯有结合商业的数据处...
- 为什么平头哥做芯片如此迅猛？
- 作者 | 胡巍巍 发自杭州云栖大会 责编 | 唐小引 出品 | CSDN（ID：CSDNnews） 2018年10月31日，阿里旗下的平头哥半导体有限公司成立。 如今，平头哥成立不到一年，就已成绩斐然。 2019年9月25日，阿里巴巴旗下半导体公司平头哥，发布含光800芯片。 2019年7月25日，平头哥发布成立后第一个基于RISC-V的处理器IP Core玄铁910。...
- 分享靠写代码赚钱的一些门路
- 作者 mezod，译者 josephchang10如今，通过自己的代码去赚钱变得越来越简单，不过对很多人来说依然还是很难，因为他们不知道有哪些门路。今天给大家分享一个精彩...
- 技术人员要拿百万年薪，必须要经历这9个段位
- 很多人都问，技术人员如何成长，每个阶段又是怎样的，如何才能走出当前的迷茫，实现自我的突破。所以我结合我自己10多年的从业经验，总结了技术人员成长的9个段位，希望对大家的职...
- 多线程编程是后台开发人员的基本功
- 这里先给大家分享一个小故事：在我刚开始参加工作的那年，公司安排我开发一款即时通讯软件（IM，类似于 QQ 聊天软件），在这之前我心里也知道如果多线程操作一个整型值是要加锁...
- 分布式、多线程、高并发都不懂，拿什么去跳槽
- 当提起这三个词的时候，是不是很多人都认为分布式=高并发=多线程？当面试官问到高并发系统可以采用哪些手段来解决，或者被问到分布式系统如何解决一致性的问题，是不是一脸懵逼？确...
- 动画：用动画给面试官解释 TCP 三次握手过程
- 作者 | 小鹿 来源 | 公众号：小鹿动画学编程 写在前边 TCP 三次握手过程对于面试是必考的一个，所以不但要掌握 TCP 整个握手的过程，其中有些小细节也更受到面试官的青睐。 对于这部分掌握以及 TCP 的四次挥手，小鹿将会以动画的形式呈现给每个人，这样将复杂的知识简单化，理解起来也容易了很多，尤其对于一个初学者来说。 学习导图 一、TCP 是什么？ TCP（Transmissio...
- 为什么程序员在学习编程的时候什么都记不住？
- 在程序员的职业生涯中，记住所有你接触过的代码是一件不可能的事情！那么我们该如何解决这一问题？作者 |Dylan Mestyanek译者 | 弯月，责编 | 屠敏出品 |...
- 500行代码，教你用python写个微信飞机大战
- 这几天在重温微信小游戏的飞机大战，玩着玩着就在思考人生了，这飞机大战怎么就可以做的那么好，操作简单，简单上手。 帮助蹲厕族、YP族、饭圈女孩在无聊之余可以有一样东西让他们振作起来！让他们的左手 / 右手有节奏有韵律的朝着同一个方向来回移动起来！ 这是史诗级的发明，是浓墨重彩的一笔，是…… 在一阵抽搐后，我结束了游戏，瞬时觉得一切都索然无味，正在我进入贤者模式时，突然想到，如果我可以让更多人已不同的方式体会到这种美轮美奂的感觉岂不美哉？ 所以我打开电脑，创建了一个 `plan_game.py`……
- 2019诺贝尔经济学奖得主：贫穷的本质是什么？
- 2019年诺贝尔经济学奖，颁给了来自麻省理工学院的 阿巴希·巴纳吉（Abhijit Vinayak Banerjee）、艾丝特·杜芙若（Esther Duflo）夫妇和哈...
- linux：最常见的linux命令（centOS 7.6）
- 最常见，最频繁使用的20个基础命令如下： 皮一下，这都是干货偶，大佬轻喷 一、linux关机命令： 1.shutdown命令安全地将系统关机（推荐）参数说明: [-r] 重启计算器。 [-h] 关机后关闭电源〔halt〕。 [-c] cancel current process取消目前正在执行的关机程序。 [-time] 设定关机〔shutdown〕前的时间。 shutdown -h now ...
- 只因写了一段爬虫，公司200多人被抓！
- “一个程序员写了个爬虫程序，整个公司200多人被端了。” “不可能吧！” 刚从朋友听到这个消息的时候，我有点不太相信，做为一名程序员来讲，谁还没有写过几段爬虫呢？只因写爬虫程序就被端有点夸张了吧。 朋友说，消息很确认并且已经进入审判阶段了。 01.对消息进一步确认 朋友认识几个律师朋友，和他们有一些业务来往，得知他们想尝试把业务扩展到程序员这个群体。那段时间我刚好离职也有时间，在朋友...