在很久之前,Insus.NET刚学习前端时,有写过《动态创建一些常的html标签http://www.cnblogs.com/insus/p/3741665.html

但其中没有实现动态产生select option下拉列表。

在jQuery环境之下使用创建jQuery对象来实现动态产生,那是很方便的事情。

在数据库中准备一些数据:

存储过程:

开发ASP.NET MVC,实现程序,少不了model:

现创建一个实体Entity,即是与数据库通讯:

接下来,你可以创建获取数据集的方法,让前端jQuery执行的方法:

ok,一切准备就绪。

创建一个select对象:

$selectCity = $('<select />').attr({ name: 'city', class: 'selectcity' });

你可以创建一个空的option:

$("<option></option>", { value: "", text: "" }).appendTo($selectCity);

从数据库读出来的数据,现可以动态产生option:

如果你需要在显示时,绑定一个选择值,那怎样实现呢?很简单的,在$.each时,判断一下:

上面的“3”是一个变量,即是你需要绑定的值。下面是效果演示:

动态产生select option列表的更多相关文章

  1. JS & JQuery 动态添加 select option

    因为是转载文章 在此标明出处,以前有文章是转的没标明的请谅解,因为有些已经无法找到出处,或者与其它原因. 如有冒犯请联系本人,或删除,或标明出处. 因为好的文章,以前只想收藏,但连接有时候会失效,所以 ...

  2. JS 通过系统时间限定 动态添加 select option

    虽然是个简单的效果,还是需要积累一下,记录一下: 在八月一号之后,删除最后一项,新添加2016级 — — 2015级 2014级 2013级 2012级 在六月一号之后,删除最后一项,新添加2016级 ...

  3. ie7 动态改变select option时,宽度自动变短解决方法

    <html> <head> <title>JQuery</title> <meta http-equiv="pragma" c ...

  4. 使用js 在IE和火狐firfox 里动态增加select 的option

    使用js 在IE和火狐firfox 里动态增加select 的option <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transition ...

  5. 纯js遍历json获取值动态为select添加option

    遍历json数组 并动态为select添加option 直接上代码,重要部分有注解 <!DOCTYPE html> <html lang="en"> < ...

  6. JS动态改变select选择变更option的index值

    document.getElementById("louyuming").options[0].selected=true; function jsSelectIsExitItem ...

  7. 动态添加select的option [转载]

    动态给select标签添加option,结合前人经验以及自己经验,现在总结三种方法供大家参考,一起交流学习!首先是定义的select元素://根据ID获得select元素 var mySelect = ...

  8. 动态添加select的option

    动态给select标签添加option,结合前人经验以及自己经验,现在总结三种方法供大家参考,一起交流学习! 首先是定义的select元素: //根据ID获得select元素var mySelect ...

  9. Jquery获取select option动态添加自定义属性值失效

    Jquery获取select option动态添加自定义属性值失效 2014/12/31 11:49:19 中国学网转载 编辑:李强 http://www.xue163.com/588880/3909 ...

随机推荐

  1. apicloud模块开发知识点

    1. 没有加模块的时候dex里面的包 \android\support\annotation \android\support\v4 \com\uzmap\pkg \compile 2. 不能混淆的类 ...

  2. hdu--6178(多校

    题意:要在一棵 n 个点的树上放 k 只猴子,然后删掉尽量多的边,使得删边后,每只猴子都至少和另外一只猴子相连,问最后剩下的边数. 思路:其实dfs遍历一次看有多少个点-边-点就好了,比赛的时候就觉得 ...

  3. P3834 【模板】可持久化线段树 1(主席树)

    #include <bits/stdc++.h> #define read read() #define up(i,l,r) for(int i = (l);i <= (r);i++ ...

  4. centos7 sqoop 1 搭建笔记

    1.require : java环境,hadoop,hive ,mysql2.下载解压sqoop13.设置环境变量 export SQOOP_HOME=/data/spark/bin/sqoop ex ...

  5. 2018.11.06 bzoj1040: [ZJOI2008]骑士(树形dp)

    传送门 由题可知给出的是基环森林. 因此对于每个基环森林找到环断开dpdpdp两次就行了. 代码: #include<bits/stdc++.h> using namespace std; ...

  6. poj-2777(区间线段树,求种类数模板)

    题目链接:http://poj.org/problem?id=2777 参考文章:https://blog.csdn.net/heucodesong/article/details/81038360 ...

  7. react添加方法的两种形式

    1.使用bind <button onClick={this.test.bind(this)}>确定</button> 2.使用箭头函数 <button onClick= ...

  8. (2)The secrets of learning a new language

    https://www.ted.com/talks/lydia_machova_the_secrets_of_learning_a_new_language/transcript 00:13I lov ...

  9. gitlab常用命令

    进入本地仓库访问位置之后执行命令 1) 远程仓库相关命令 检出仓库:$ git clone git://github.com/jquery/jquery.git 查看远程仓库:$ git remote ...

  10. 关于CSS的优先级,CSS优先级计算,多个class引用

    原则一: 继承不如指定 原则二: #id > .class > 标签选择符 原则三:越具体越强大 原则四:标签#id >#id ; 标签.class > .class CSS优 ...