例如:
option = ["A","B","C","D"];
共四个select,每一个都是下面的结构,option用动态加载
<select name="ft">
<option>A</option>
<option>B</option>
<option>C</option>
<option>D</option>
</select>
当第一个select选中A后,下一个要选择的select点开后只有B,C,D;依次类推。怎么实现呢?可以用jq
select的option元素怎么动态加载呢
- 写回答
- 好问题 提建议
- 追加酬金
- 关注问题
微信扫一扫
分享- 邀请回答
8条回答 默认 最新
- 关注
码龄 粉丝数 原力等级 --
- 被采纳
- 被点赞
- 采纳率
white_g 2017-07-13 04:49最佳回答 专家已采纳之前答案有朋友支出有bug,这里改一下。
<select style="width:100px" id="s1" class="s" name="ft"> <option value="" disabled selected>请选择</option> <option>A</option> <option>B</option> <option>C</option> <option>D</option> </select> <select style="width:100px" id="s2" class="s"> <option value="" disabled selected>请选择</option> </select> <select style="width:100px" id="s3" class="s"> <option value="" disabled selected>请选择</option> </select> <select style="width:100px" id="s4" class="s"> <option value="" disabled selected>请选择</option> </select> <script> var arr = []; var $select = $('.s'); var index = 0; function se(dom,index){ dom.eq(index++).on('change',function(){ for(var i = index;i<dom.length;i++){ dom.eq(i).html('<option value="" disabled selected>请选择</option>'); } arr[$(this).index()] = $(this).val(); dom.eq(index).html($(this).html()).find('option').each(function(){ var l = $(this).parent().index(); for(var i = 0;i<l;i++){ if($(this).val() === arr[i]){ $(this).hide(); } } }) }); if(index < dom.length){ se(dom,index); } } se($select,0); </script>
采纳该答案 已采纳该答案 专家已采纳评论解决 无用打赏举报微信扫一扫
分享评论登录 后可回复...
查看更多回答(7条)
报告相同问题?
提交
相关推荐 更多相似问题
- 2017-07-12 12:04回答 8 已采纳 之前答案有朋友支出有bug,这里改一下。 ``` 请选择 A B C D 请选择 请选择 请选择 ```
- 2022-01-08 13:52回答 3 已采纳 少了页面初始加载数据
- 2019-01-04 18:18回答 5 已采纳 ajax默认使用异步请求 alert会卡js,点击确认后才会执行下一行js 在这里,你的请求发出后,数据还没发回来,然后如果没有alert的话就立即执行了你的切换选中的操作, 因为下拉框里没有任
- 2020-12-11 00:17但其中没有实现动态产生select option下拉列表。 在jQuery环境之下使用创建jQuery对象来实现动态产生,那是很方便的事情。 在数据库中准备一些数据: 存储过程: 开发ASP.NET MVC,实现程序,少不了model: 现...
- 2020-12-09 18:21现在项目中的select需要根据不同的场景使用不同的数据,解决方式就是动态加载option数据。 代码部分: 下面步骤介绍了如何从数据库获取数据,并动态的在前端显示。 步骤一:jsp页面静态的select: <select id=...
- 2021-11-01 17:46auserroot的博客 实现 select 滚动 options 动态加载 vue <el-select v-model="bankName" filterable remote v-loadmore='scroll' reserve-keyword placeholder="请输入" :remote-method="searchBank" @change="selectChange" :...
- 2019-07-15 13:26回答 1 已采纳 1.第一级onChange的时候,清空第二级的options和form的值。清空第三级的options和form的值 2.查询第二级的后台接口,返回第二级的options,merge这个option
- 2021-12-06 09:41回答 2 已采纳 1.页面没有报错吗,看看你下拉列表的数据,2. :key绑定的item.compName是唯一值吗,不应该是keyCode才是他的唯一id吗,看看你3. 清空的时候也会调用change事件,看看你c
- 2021-10-04 15:27回答 1 已采纳 题主没搞清楚服务器端和客户端代码的关系,服务端无法直接使用客户端的js变量,需要用ajax提交到服务器后才能获取
- 2021-01-17 19:33weixin_39607090的博客 现在项目中的select需要根据不同的场景使用不同的数据,解决方式就是动态加载option数据。代码部分:下面步骤介绍了如何从数据库获取数据,并动态的在前端显示。步骤一:jsp页面静态的select:选择A选择B选择C注意:...
- 2019-11-28 22:12Take^that的博客 layui的select 若已经给了选项的数据,它还会动态生成另外一段代码: <dl class="layui-anim layui-anim-upbit"/> 想自己添加动态的数据,则我们也需要添加: <dl class="layui-anim layui-anim-upbit"/&...
- 2021-02-25 16:47眼泪落在琴弦的博客 layui 动态加载select并option选中但没有赋值 var select='dd[lay-value='+data.code+']'; $("#code").siblings("div .layui-form-select").find('dl').find(select).click();
- 2016-10-26 06:14回答 2 已采纳 You forgot the closing double quote " at the end also the doubles for the concatation is not neede
- 2017-11-28 02:05回答 16 已采纳 ``` 此处加了一个,,该列全部跟着变注释、提示
- 2017-04-25 00:33回答 2 已采纳 Ok, i understood, try sth like : <script type="text/javascript"> $(document).ready( funct
- 2019-06-29 13:57SD_54的博客 select下拉框的内容来自某个表的数据。 可以使用select点击或者直接加载触发请求的事件。 实施 html <select id = "functionCode"> <option value = "">请选择</option> </select> ...
- 2017-09-25 10:05梦里梦见醒不来丶的博客 示例:我这里是通过选择的房间获取对于房间的柜子,然后动态放到另一个select里面 转移到房间: <select name="positionId" id="positionId" style="width: 100px;" class="form-control" onchange="getCabinet();...
- 2021-09-18 17:22敲完这个我就再也不熬夜了的博客 遇到业务需要下拉选择框动态请求接口数据,element又没有提供动态加载api,就只能自己写了 代码 <template> <div> <el-select v-model="organization_id" placeholder="请选择"> <el-...
- 2017-04-17 07:49回答 2 已采纳 I figured out the way to pass variable to next page through URL Here is how i did it: $(document)
- 2022-01-07 10:44七月吃橘子的博客 jquery代码: // list的数据你可以用Ajax获取,我这块就是从后台拿到的数据,这块代码就就不放了 for (var i=0; i<list.length; i++) { $("#selectList").append("&...select id="selectList"> <option valu
- 没有解决我的问题, 去提问