后台传进来一个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. compile FFMPEG under windows

    这个文章应该算是中文版最好的了.但是还有一些需要修正. 特别是winsock2的处理 win10 msys2 vs2015 ffmpeg3.2.2 编译 这个英文版的才是最好的 Building ff ...

  2. 雷林鹏分享:jQuery EasyUI 窗口 - 自定义窗口工具栏

    jQuery EasyUI 窗口 - 自定义窗口工具栏 默认情况下,窗口(window)有四个工具:collapsible.minimizable.maximizable 和 closable.比如我 ...

  3. 解释变量(Explanatory Variable)

    转自:http://www.statisticshowto.com/explanatory-variable/ What is an Explanatory Variable? An explanat ...

  4. webService上传图片

    webService /// <summary> /// 上传图片webServer 的摘要说明 /// </summary> [WebService(Namespace = ...

  5. liunx系统部署

    Linux系统安装与基本配置 =======================================内容提要:获取Linux 常用发行版的方式DELL/HP/IBM 服务器介绍DELL/HP/ ...

  6. manifest.xml微擎系统模块的安装文件内容

    微擎在安装或卸载模块时会根据manifest.xml生成(或删除)数据库中相应记录,并执行manifest.xml里指定的脚本. manifest.xml文件内容详细介绍如下: manifest - ...

  7. 基于VMware模拟实现远程主机网络通信

    基于VMware模拟实现远程主机网络通信 目的: 基于VMware软件,模拟实现不同网段的两主机,通过路由器进行通信.两主机host A和host B分别处于VMnet6网络和VMnet7网络,都属于 ...

  8. 可以进行SHA-1,SHA-224,SHA-256,SHA-384,SHA-512五种算法签名的工具类,以及简单说明

    import java.security.MessageDigest; public class SignatureSHA { public static String signSHA(String ...

  9. ubuntu 安装国际qq

    下载地址::http://pan.baidu.com/s/1nt1Nu6P 解压后,输入终端:suao dpkg -i 解压的文件名称.deb 如果你前面安装过qq,你可以输入sudo dpkg -P ...

  10. Spring + Mybatis项目实现数据库读写分离

    主要思路:通过实现AbstractRoutingDataSource类来动态管理数据源,利用面向切面思维,每一次进入service方法前,选择数据源. 1.首先pom.xml中添加aspect依赖 & ...