Loading [MathJax]/jax/output/CommonHTML/config.js

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >问答首页 >Jquery动态下拉菜单

问Jquery动态下拉菜单
EN

Stack Overflow用户

提问于 2014-06-30 16:28:14

回答 1查看 70关注 0票数 0

我有一个动态填充字符串文本选项的下拉菜单。在我的页面的其他地方，当用户在文本框中输入文本时，我需要查看输入到文本框中的文本是否与下拉菜单中的某个选项匹配。如果文本不匹配，我需要选中一个复选框。我如何使用jquery来实现这一点？我遇到了一些困难，因为下拉菜单选项是动态的，而不是静态的。谢谢你的帮助。

EN

回答 1

Stack Overflow用户

发布于 2014-06-30 16:34:24

假设您的dropdown由列表项中的列表组成，您可以尝试这样的操作：

$(textelement).on('change', function() {
     var elements = $(dropdownList).children();
     for (int i = 0; i < elements.length; i++) {
          if ($(this).value() == elements.html()) {
               $(checkbox).prop('checked', false);
          } else {
               $(checkbox).prop('checked', true);
          }
     }
});

我没有检查这是否有效，但你应该理解它的概念。

票数 0

EN

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/24494756

复制

相关文章

jQuery练习——下拉菜单

jquery css html

实现效果：当鼠标移到不同的一级菜单，会显示相应的二级菜单，鼠标移走，二级菜单消失。

颜颜yan_

2022/12/01

27.4K0

jQuery下拉菜单经典案例

jQuery下拉菜单经典案例源码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <

红目香薰

2022/11/29

11.4K0

javascript下拉菜单代码(用jquery做下拉菜单)

java https html 网络安全

发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/126047.html原文链接：https://javaforall.cn

全栈程序员站长

2022/08/01

11.8K0

javascript下拉菜单代码(用jquery做下拉菜单)

jQuery简单实现二级下拉菜单

下拉菜单原理:滑过一级的li才让第二层的li显示,利用jq简单的抓取元素,让一级下的二级li显示就能解决,使用jq比css的思路更加明确!

十月梦想

2018/08/29

4.5K0

第72天：jQuery实现下拉菜单

1、块元素居中：给块元素本身设置：margin:0 auto;，块元素必须设置宽度

半指温柔乐

2018/09/11

2K0

js_jQuery【下拉菜单联动dom操作】

下拉菜单联动dom操作案例源码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </hea

红目香薰

2022/11/29

14.5K0

js_jQuery【下拉菜单联动dom操作】

jenkins动态读取文件生成下拉菜单

其实实现这个功能是基于Jenkins的Active Choices Reactive Parameter插件和groovy脚本实现，另外还需要配合选项参数(Choice Parameter)``<br />

dogfei

2020/07/31

3K0

jQuery 动态绑定

这是在项目过程中所遇到的一个问题，给 JS 动态生成的元素绑定事件失效，代码如下所示：

Nian糕

2018/08/21

2.1K0

一刻课堂——jquery_15实例_下拉菜单

用户1730674

2018/05/02

1.3K0

Excel: 设置动态的二级下拉菜单

https 网络安全 node.js windows server

文章背景：在进行数据录入时，为了提高录入效率和规范用户操作，会使用数据验证功能（Data Validation），得到一级菜单和二级菜单，供用户选择输入。本文要讲述的是如何通过offset、match和counta函数，得到动态的二级下拉菜单。

Exploring

2022/09/20

5K0

Excel: 设置动态的二级下拉菜单

CSS 下拉菜单_下拉菜单html

https 网络安全

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至举报，一经查实，本站将立刻删除。

全栈程序员站长

2022/11/01

7.2K0

jquery实现表格动态添加

php 数据库 sql

//点击追加触发 $(function(){ $("#button").click(function(){ var div_ = $("#sel").val(); var context = $("#context").val(); append(div_,context); //$("#tab tr:not(:first)").remove(); //$("#tab tbody").empty(); $("#tab tbody").remove(); query(); }); }); //点击查询全部触发 $(function(){ $("#but").click(function(){ $("#tab tbody").remove(); //$("#tab tr:not(:first)").remove(); //$("#tab tbody").empty(); query(); }); }); //点击模糊查询触发 $(function(){ $("#query").click(function(){ var context = $("#context").val(); alert("您输入的内容为："+context); $("#tab tr:not(:first)").empty(); //$("table tbody").remove(); queryByContext(); }); }); //删除事件 function del(id){ var url = "testController/delModel"; $.ajax({ type: 'POST', url: url, data:{id: id}, dataType: 'json', success: function(data){ alert("数据库删除成功"); $("#tab tr:not(:first)").empty(); query(); }}); }; //编辑事件 function upd(id){ var url = ""; $.ajax({ type: 'POST', url: url, data:{id: id}, dataType: 'json', success: function(data){ alert("数据库编辑成功"); $("#tab tr:not(:first)").empty(); query(); }}); } //添加方法 function append(div_,context){ $("#"+div_).append("<tr><td>"+ div_ +"</td>"+"<td>"+context+"</td></tr>"); $.get("testController/addModel",{div_id: div_, context: context }).done(function( data ) { alert("添加到数据库成功"); }); }; //模糊查询方法 function queryByContext(){ var url = "testController/queryAllDataByContext"; $.ajax({ type: 'POST', url: url, data:{context:$("#context").val()}, dataType: 'json', success: function(data){ alert("数据库查询成功"); console.log(data); for(var i=0;i<data.length;i++){ var id = data[i].id; var divId = data[i].divId; var context = data[i].context; var dtt = data[i].dtt; //alert(id); $("#tab thead").append("<tr><td>"+id+"</td>"+"<td>"+divId+"</td>"+"<td>"+context+"</td>"+"<td>"+dtt+"</td>"+"<td><a class='del'onclick='del("+id+")'>删除</a></td></tr>"); } }, error:function(){ alert("数据库查询失败"); } }); }; //查询全部方法 function query(){ var url = "testController/queryAllData"; $.ajax({ type: 'POST', url: url, dataType: 'json', success: function(data){ alert("查询成功"); con

yaohong

2019/09/11

3.5K0

javascript动态设置select下拉菜单字体大小

本章节分享一段极其简单的代码实例，它使用javascript实现了动态设置select下拉菜单字体大小的功能。

IT工作者

2021/12/28

1.6K0

jquery validate动态添加/删除规则

jquery form input onclick rules

项目中用到了jquery vilidate插件来校验，使用中遇到点小波折，这里跟大家分享一下，希望大家少走一些弯路。很多使用手册里面都会提到最基本的validate()方法，这个在使用时一般不会出现问题，如果有些小伙伴不想输入完成后立即校验可以通过设置下面这几个属性：

johnhuster的分享

2022/03/28

2.1K0

使用 jQuery 对下拉菜单 SELCET 进行增加、删除和修改的操作

jquery select text

jQuery 获取下拉菜单 SELECT 选择的 Text 和 Value: //获取Select选择的Text var checkText=jQuery("#select_id").find("option:selected").text(); //获取Select选择的option Value var checkValue=jQuery("#select_id").val(); //获取Select选择的索引值 var checkIndex=jQuery("#select_id ").get(

Denis

2023/04/15

1.4K0

jquery插件treetable 动态加载问题

node.js 编程算法 ide html https

在增加或修改后，动态加载html，开始就直接使用 $(“#treeTable tbody”).empty().append(data); 这个用法是错误的，

全栈程序员站长

2022/09/01

2.9K0

使用 Spring Boot 从数据库实现动态下拉菜单

数据库 spring 存储 boot 函数

动态下拉菜单（或依赖下拉菜单）的概念对于编码来说是令人兴奋且具有挑战性的。动态下拉列表意味着一个下拉列表中的值取决于前一个下拉列表中选择的值。一个简单的示例是三个下拉框，显示区、taluk 和村庄的名称，其中 taluk 中的值取决于区中选择的值，村庄中的值取决于 taluk 下拉列表中选择的值。动态下拉可以使用以下技术来实现：

用户1418987

2023/10/26

1.3K0

使用 Spring Boot 从数据库实现动态下拉菜单

bootstrap 下拉菜单

<!doctype html> <html> <head> <meta charset="utf-8"> <title>联想控股</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="css/bootstrap.css" rel="stylesheet" type="text/css"> <script src="http://code.jquery.com/jquery.js"></script> <script src="js/bootstrap.min.js"></script> </head> <body> 　<div class="dropdown"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 下拉菜单<span class="caret"></span> </button> <ul class="dropdown-menu"> <li><a href="#">菜单项1</a></li> <li><a href="#">菜单项2</a></li> <li><a href="#">菜单项3</a></li> </ul> </div> </body> </html>

用户5760343

2019/07/05

4.7K0

jquery file upload插件动态修改url

php 腾讯云开发者社区

jquery file-upload是一款特别好用的文件上传插件，支持单文件以及多文件上传，下面直接看代码：

johnhuster的分享

2022/03/28

1.1K0

京东网页（动态）搭建，利用jquery实现

jquery css html

源代码已分享至本人云盘~~~ 链接：https://pan.baidu.com/s/1Nr5l2Smcmaevs5HHDh5y_A 提取码：blif

时间静止不是简史

2020/07/24

3.5K0

京东网页（动态）搭建，利用jquery实现

相似问题

jquery动态下拉菜单

12

Jquery动态下拉菜单

30

动态JQuery切换下拉菜单

10

jquery动态下拉菜单-附加问题

12

使用jquery的动态下拉菜单

20

添加站长进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例