后台传进来一个List集合,存着某对象集合,将其显示在下拉列表

一、HTML代码

页面有个下拉列表,如图所示:

<td style="width:30%">
<select id="projectInfo">
<option value="-1">请选择</option>
</select>
</td>

二、JS代码

将每个对象的名字和对应ID都绑定在下拉列表,页面显示其名字,后台我们又能通过其id对其进行操作

function displayProject(obj){
var selector = document.getElementById("projectInfo");
for(var i=;i<obj.length;i++){
var option = new Option(obj[i].projectName, obj[i].id);
selector.options.add(option);
}
}

(obj:就是后台传来的List对象集合)

new Option(text,value)

text:指定option对象的text属性(即<option></option>之间的文字)
value:指定option对象的value属性

三、Jquery获取选中值

获取选中的value

$('#projectInfo option:selected').val();

获取选中的text

$('#projectInfo option:selected').text();

四、JavaScript获取选中值

(1)获得下拉列表

var projectInfo=document.getElementById("projectInfo");

(2)获得选中项索引

var index = projectInfo.selectedIndex

(3)获得选中项value或text

projectInfo.options[index].value;

projectInfo.options[index].text;

Java:下拉列表绑定后台数据的更多相关文章

  1. asp.net 前台绑定后台变量方法总结:<%= %> 和<%# %>的区别

    经常会碰到在前台代码中要使用(或绑定)后台代码中变量值的问题.一般有<%= str%>和<%# str %>两种方式,这里简单总结一下.如有错误或异议之处,敬请各位指教.  一 ...

  2. ASP.NET WebForm中前台代码如何绑定后台变量

    转载自 http://www.cnblogs.com/lerit/archive/2010/10/22/1858007.html 经常会碰到在前台代码中要使用(或绑定)后台代码中变量值的问题.一般有& ...

  3. ASP.NET前台代码绑定后台变量方法总结

    经常会碰到在前台代码中要使用(或绑定)后台代码中变量值的问题.一般有<%= str%>和<%# str %>两种方式,这里简单总结一下.如有错误或异议之处,敬请各位指教. 一方 ...

  4. 转:ASP.NET前台代码绑定后台变量方法总结

    经常会碰到在前台代码中要使用(或绑定)后台代码中变量值的问题.一般有<%= str%>和<%# str %>两种方式,这里简单总结一下.如有错误或异议之处,敬请各位指教. 一方 ...

  5. [ASP.NET] 前台代码绑定后台变量方法总结 [转]

    原文链接:https://www.cnblogs.com/lerit/archive/2010/10/22/1858007.html 经常会碰到在前台代码中要使用(或绑定)后台代码中变量值的问题.一般 ...

  6. Javaweb项目-下拉列表显示后台数据库的数据

    下面将演示前端下拉列表显示后台数据库中class表的说有班级的名称 环境: Tomcat-8.5.40 mysql-8.0.13 eclipse-4.9.0 springmvc框架 一.从mysql中 ...

  7. html页面下拉列表中动态添加后台数据(格式化数据,显示出数据的层次感)

    html页面下拉列表中动态添加后台数据(格式化数据,显示出数据的层次感) 效果图: 运行原理和技术: 当页面加载完毕,利用jquery向后台发送ajax请求,去后台拼接<select>&l ...

  8. Java语言实现通过Ajax抓取后台数据及图片

    1.Java语言实现通过Ajax抓取后台数据及图片信息 1.1数据库设计: create table picture( pic_id number not null, pic_name )not nu ...

  9. 【POI】java服务生成List数据集合,后台服务生成xlsx临时文件,并将临时文件上传到腾讯云上

    场景: java服务生成List数据集合,后台服务生成xlsx临时文件,并将临时文件上传到腾讯云上 今日份代码: 1.先是一个变量,作为文件名 private static final String ...

随机推荐

  1. maven配置环境变量失败解决办法

    配置maven路径什么的统统正确,最后测hi不成功.在网上搜索了好多资料方法都解不了 具体问题具体对待吧,如果有和我类似的小伙伴,可以尝试一下我的这个办法,在maven路径后面加/bin path变量 ...

  2. JS 日期比较方法

    1.日期参数格式:yyyy-mm-dd // a: 日期a, b: 日期b, flag: 返回的结果 function duibi(a, b,flag) { var arr = a.split(&qu ...

  3. 20190102xlVBA_多表按姓名同时拆分

    Sub 多表按姓名同时拆分20190102() AppSettings Dim StartTime As Variant Dim UsedTime As Variant StartTime = VBA ...

  4. Build Castles(构建城堡)

    Charlemagne, the King of Frankie, 英文描述 请参考图片中的说明. 中文描述 根据给出的数组确定能够盖多少城堡. 思路和点评 我不能确定我的思路是正确的,也欢迎大家参与 ...

  5. 苹果手机marquee显示文字不全,如何解决?

    不能给marquee设定宽度,如果想只显示屏幕宽度的一部分,就给marquee外面包一个div,给外面的div设定宽度,这样就解决了文字显示不全的问题

  6. C# 有哪些集合

    队列[Queue] //队列:先进先出 /* *增加元素到队列结尾处 *移除队列开始处 */ Queue queue=new Queue(); queue.Enqueue(Object); queue ...

  7. python记录_day07

    一.基本数据类型补充 1.列表的拼接用join()方法 li = ["hello","world"] s = "_".join(li) pr ...

  8. shiro会话管理

    Shiro提供了完整的企业级会话管理功能,不依赖于底层容器(如web容器tomcat),不管JavaSE还是JavaEE环境都可以使用,提供了会话管理.会话事件监听.会话存储/持久化.容器无关的集群. ...

  9. 【JS】【3】标签显示几秒后自动隐藏

    $("#XXX").show().delay(2000).hide(0); 2000,0:可选,速度,(毫秒:"slow":"fast") ...

  10. 关于react16.4——上下文Context

    首先我们来聊一聊(上下文)Context. 上下文(Context) 提供了一种通过组件树传递数据的方法,无需在每个级别手动传递 props 属性. 在典型的 React 应用程序中,数据通过 pro ...