Java:下拉列表绑定后台数据
后台传进来一个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:下拉列表绑定后台数据的更多相关文章
- asp.net 前台绑定后台变量方法总结:<%= %> 和<%# %>的区别
经常会碰到在前台代码中要使用(或绑定)后台代码中变量值的问题.一般有<%= str%>和<%# str %>两种方式,这里简单总结一下.如有错误或异议之处,敬请各位指教. 一 ...
- ASP.NET WebForm中前台代码如何绑定后台变量
转载自 http://www.cnblogs.com/lerit/archive/2010/10/22/1858007.html 经常会碰到在前台代码中要使用(或绑定)后台代码中变量值的问题.一般有& ...
- ASP.NET前台代码绑定后台变量方法总结
经常会碰到在前台代码中要使用(或绑定)后台代码中变量值的问题.一般有<%= str%>和<%# str %>两种方式,这里简单总结一下.如有错误或异议之处,敬请各位指教. 一方 ...
- 转:ASP.NET前台代码绑定后台变量方法总结
经常会碰到在前台代码中要使用(或绑定)后台代码中变量值的问题.一般有<%= str%>和<%# str %>两种方式,这里简单总结一下.如有错误或异议之处,敬请各位指教. 一方 ...
- [ASP.NET] 前台代码绑定后台变量方法总结 [转]
原文链接:https://www.cnblogs.com/lerit/archive/2010/10/22/1858007.html 经常会碰到在前台代码中要使用(或绑定)后台代码中变量值的问题.一般 ...
- Javaweb项目-下拉列表显示后台数据库的数据
下面将演示前端下拉列表显示后台数据库中class表的说有班级的名称 环境: Tomcat-8.5.40 mysql-8.0.13 eclipse-4.9.0 springmvc框架 一.从mysql中 ...
- html页面下拉列表中动态添加后台数据(格式化数据,显示出数据的层次感)
html页面下拉列表中动态添加后台数据(格式化数据,显示出数据的层次感) 效果图: 运行原理和技术: 当页面加载完毕,利用jquery向后台发送ajax请求,去后台拼接<select>&l ...
- Java语言实现通过Ajax抓取后台数据及图片
1.Java语言实现通过Ajax抓取后台数据及图片信息 1.1数据库设计: create table picture( pic_id number not null, pic_name )not nu ...
- 【POI】java服务生成List数据集合,后台服务生成xlsx临时文件,并将临时文件上传到腾讯云上
场景: java服务生成List数据集合,后台服务生成xlsx临时文件,并将临时文件上传到腾讯云上 今日份代码: 1.先是一个变量,作为文件名 private static final String ...
随机推荐
- CentOS 6.8 源码安装RabbitMQ
一.安装依赖环境 yum install build-essential openssl openssl-devel unixODBC unixODBC-devel make gcc gcc-c++ ...
- go 圣经阅读笔记之-入门
go 圣经 这本书英文名为 <The Go Programming Language> 1. 简单hello world示例 helloworld.go package main impo ...
- C# 定时调用方法
private void button1_Click(object sender, EventArgs e) { System.Timers.Timer timer = new System.Time ...
- nodejs安装、环境配置和测试
nodejs下载 https://nodejs.org/en/ nodejs安装 双击下载的nodejs,可自定义安装路径,安装模块部分直接next即可安装. 检查是否安装 win+R输入cmd,打开 ...
- 20165309 实验一 Java开发环境的熟悉
20165309 实验一 Java开发环境的熟悉 一.实验内容及步骤 (一)命令行下Java程序开发 在Linux下用ctrl+alt+T打开终端,用mkdir创建文件夹后cd进入. 在vim下键入如 ...
- Linux命令详解-file
file命令用来识别文件类型,也可用来辨别一些文件的编码格式.它是通过查看文件的头部信息来获取文件类型,而不是像Windows通过扩展名来确定文件类型的. 1.命令格式: file [ -bchikL ...
- 『TensorFlow Internals』笔记_源码结构
零.资料集合 知乎专栏:Bob学步 知乎提问:如何高效的学习 TensorFlow 代码?. 大佬刘光聪(Github,简书) 开源书:TensorFlow Internals,强烈推荐(本博客参考书 ...
- Loadrunner打不开浏览器以及卡死的各种问题
Loadrunner11.0启动WebTours之总结1 第一次安装LR11时,安装安组件后没有对电脑进行重启,直接安装的LR112 安装完毕LR后,录制脚本时发现不能启动IE11.百度发现LR支持I ...
- Matlab-4:追赶法(crout分解)工具箱
function x=chase (a,b,c,f) % the method of chaase******************************* % a, b, c,分别是是方程组的下 ...
- python-day97--git协同开发
1.协同开发流程 - 在dev的基础上创建三个开发的分支 -每个人都在自己的分支中进行开发 -第一个人开发完成之后把review分支从云端版本库中拉下来 -将个人的分支与review分支合并(确保re ...