使用js生成下拉列表项
在项目中经常会使用到一个简单的表单元素,那就是下拉列表。但是由于企业的列表项并不是固定的,因此列表项的内容需要到数据库或者接口中取,因此怎样获取,并且能应用到
多个相似的下拉列表就需要思考一下。
我这里将js代码简单贴写:
<script type="text/javascript">
$(document).ready(function () {
select("plats","plats");
});
function select(id,name){//这样写可以接受多种参数,方便其他地方使用生成下拉列表项
$.ajax({
type: "POST",
url: "getCodeType",
data: { //发送给数据库的数据
codeType: name
},
dataType: 'json',
success: function (data) {
if(data.code == "00"){
$("#"+id+"").empty();
$("#"+id+"").append("<option value=''>请选择</option>")
$.each(data.data, function (data, item) {
$("#"+id+"").append("<option value='" + item.id + "'>" + item.codeName + "</option>")
});
}
}
})
}
</script>
//相关html
<div class="marRight inlineBlock">
<label>平台:</label>
<select class="sel" name="plats" id="plats">
<option value=''>请选择</option>
</select>
</div>
以上就是简单的应用。
使用js生成下拉列表项的更多相关文章
- js动态生成下拉列表
经常需要用到js动态生成下拉列表的功能,记录下来备用. 示例需求:通过ajax请求,从后台获取用户姓名列表,并添加到下拉列表中.js代码如下: function getNameList(){ //如果 ...
- js生成条形码插件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- nuxt使用QRCode.js 生成二维码
QRCode.js 是一个用于生成二维码图片的插件, 官方文档 . 我是在nuxt.js(vue官方的服务端渲染方式)项目里使用的QRCode.js: 第一步:看官方文档: 第二步:下载QRCode. ...
- 原生JS实现下拉列表
1 <div class="list"> 2 <ul> 3 <li> 4 <a href="#">Web部< ...
- 利用scrapy-splash爬取JS生成的动态页面
目前,为了加速页面的加载速度,页面的很多部分都是用JS生成的,而对于用scrapy爬虫来说就是一个很大的问题,因为scrapy没有JS engine,所以爬取的都是静态页面,对于JS生成的动态页面都无 ...
- JS生成二维码,允许中文转码
一.使用jquery-qrcode生成二维码 先简单说一下jquery-qrcode,这个开源的三方库(可以从https://github.com/jeromeetienne/jquery-qrcod ...
- js生成随即字符串
js生成随即字符串 /* *js生成随即字符串原来如此简单 *toString() radix argument must be between 2 and 36 */ function uuid() ...
- 在后台代码中动态生成pivot项并设置EventTrigger和Action的绑定
最近在做今日头条WP的过程中,遇到需要动态生成Pivot项的问题.第一个版本是把几个频道写死在xaml里了,事件绑定也写在xaml里,每个频道绑定一个ObservableCollection<A ...
- js生成[n,m]的随机数
一.预备知识 Math.ceil(); //向上取整. Math.floor(); //向下取整. Math.round(); //四舍五入. Math.random(); //0.0 ~ 1 ...
随机推荐
- POJ 3264 Balanced Lineup(zkw线段树)
[题目链接] http://poj.org/problem?id=3264 [题目大意] 求区间最大值和最小值的差值 [题解] 线段树维护区间极值即可 [代码] #include <cstdio ...
- [POI2014]Freight
题目大意: 有两个城镇$A$和$B$,有$n(n\le10^6)$辆车从$A$地出发前往$B$再返回$A$地.两地之间的行驶时间为$s(s\le10^9)$,每辆车从$A$地出发的最早时间是$t_i( ...
- List和ArrayList的区别和联系
1. List是一个接口,而ArrayList是List接口的一个实现类. ArrayList类继承并实现了List接口. 因此,List接口不能被构造,也就是我们说的不能创建实例对象,但是我们 ...
- 【转】MySQL5.5的my.cnf 参数详解
这篇文章很多地方只是翻译了my.cnf原始配置文件的说明 以下原文中有些参数事实上不适用于MySQL5.5,不知道原作者是否有经过实际测试,比如log-slow-queries应该写成slow-que ...
- linux的dd命令详解
一.dd命令的解释 dd:用指定大小的块拷贝一个文件,并在拷贝的同时进行指定的转换. 块大小可以使用的计量表 参数注释: 1. if=文件名:输入文件名,缺省为标准输入stdin.即指定源文件.< ...
- Java防止SQL注入的几个途径
java防SQL注入,最简单的办法是杜绝SQL拼接,SQL注入攻击能得逞是因为在原有SQL语句中加入了新的逻辑,如果使用 PreparedStatement来代替Statement来执行SQL语句,其 ...
- python项目构建工具zc.buildout
转载:http://blog.csdn.net/u011630575/article/details/52940099 buildout简介 Buildout 是一个基于Python的构建工具, Bu ...
- Linux增加挂载盘
命令:fdisk /dev/sdb, m 命令:m,n,e,1,p,w 命令:mkfs -t ext4 /dev/sdb,y 挂载命令:mount -t ext4 /dev/sdb /data 获取U ...
- debug模式下dlgdata.cpp line 43 断言失败
我在VC6下显示Line 43, Line 624行失败 网上有Line 40行猜测是其他版本 运行程序出错,定位如下: HWND CDataExchange::PrepareCtrl(int nID ...
- Kubernetes - 配置Nginx-Ingress 作为服务发现
添加 Kubernetes ConfigMap配置来自定义端口与服务的映射关系 配置文件, 有二个在默认空间下web服务和api服务分别映射到自定义端口 9001, 9002 apiVersion: ...