bootstrap下拉框动态赋值方法


Posted in Javascript onAugust 10, 2018

以前一直使用easyui,发现越来越跟不上现在前端的一些技术,所以改用bootstrap,然后发现好多包括简单的下拉赋值都不会了,这里上网找了下,然后发现下面这个不错,用上了,特此记录一下

<script type="text/javascript">
 /** 
  */ 

  window.onload = function () {
   showsmsselect(); 
  }

  function showsmsselect() { 
   $.ajax({ 
    url : "${pageContext.request.contextPath}/user/finduserRealName.do", //所需要的列表接口地址 
    type : "get", 
    dataType : "json", 
    success : function(result) { 
      var h = ""; 
      $.each(result, function(key, value) {

       h += "<option value='" + value.id + "'>" + value.realname //下拉框序言的循环数据
       + "</option>"; 
      }); 
      $("#addrole").append(h);//append 添加进去并展示 
      $("#addrole").on( 
        "change", 
        function(a, b, c) { 
         $("#contentID").val( 
           $("#addrole option:selected").val());

         $("#contentName").val( 
           $("#addrole option:selected").text());

        }) 
    } 
   }); 
  } 

 </script>

以上这篇bootstrap下拉框动态赋值方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
IE innerHTML,outerHTML所引起的问题
Jun 04 Javascript
javascript正则匹配汉字、数字、字母、下划线
Apr 10 Javascript
jquery加载图片时以淡入方式显示的方法
Jan 14 Javascript
基于Bootstrap实现tab标签切换效果
Apr 15 Javascript
jQuery实现弹幕效果
Feb 17 Javascript
微信小程序实战之顶部导航栏(选项卡)(1)
Jun 19 Javascript
在 Angular-cli 中使用 simple-mock 实现前端开发 API Mock 接口数据模拟功能的方法
Nov 28 Javascript
JS集合set类的实现与使用方法示例
Feb 01 Javascript
JS实现图片轮播效果实例详解【可自动和手动】
Apr 04 Javascript
浅谈Vue3.0之前你必须知道的TypeScript实战技巧
Sep 11 Javascript
Vue项目打包部署到iis服务器的配置方法
Oct 14 Javascript
原生JavaScript实现贪吃蛇游戏
Nov 04 Javascript
layui实现点击按钮给table添加一行
Aug 10 #Javascript
vuejs使用axios异步访问时用get和post的实例讲解
Aug 09 #Javascript
解决select2在bootstrap modal中不能正常使用的问题
Aug 09 #Javascript
一个Vue视频媒体多段裁剪组件的实现示例
Aug 09 #Javascript
bootstrap动态调用select下拉框的实例代码
Aug 09 #Javascript
vue.js 中使用(...)运算符报错的解决方法
Aug 09 #Javascript
select2 ajax 设置默认值,初始值的方法
Aug 09 #Javascript
You might like
在WAMP环境下搭建ZendDebugger php调试工具的方法
2011/07/18 PHP
PHP中__FILE__、dirname与basename用法实例分析
2014/12/01 PHP
PHP使用DirectoryIterator显示下拉文件列表的方法
2015/03/13 PHP
php 实现一个字符串加密解密的函数实例代码
2016/11/01 PHP
javascript 支持ie和firefox杰奇翻页函数
2008/07/22 Javascript
jQuery Flash/MP3/Video多媒体插件
2010/01/18 Javascript
innerHTML动态添加html代码和脚本兼容多个浏览器
2014/10/11 Javascript
jQuery实现手机号码输入提示功能实例
2015/04/30 Javascript
jQuery实现宽屏图片轮播实例教程
2015/11/24 Javascript
jQuery插件FusionCharts绘制2D双折线图效果示例【附demo源码】
2017/04/14 jQuery
JS实现给json数组动态赋值的方法示例
2020/03/19 Javascript
深入浅析JavaScript中的RegExp对象
2017/09/18 Javascript
在Web关闭页面时发送Ajax请求的实现方法
2019/03/07 Javascript
Vue Router history模式的配置方法及其原理
2019/05/30 Javascript
微信小程序webview 脚手架使用详解
2019/07/22 Javascript
JS查找孩子节点简单示例
2019/07/25 Javascript
vue element upload实现图片本地预览
2019/08/20 Javascript
vue+echarts实现动态折线图的方法与注意
2020/09/01 Javascript
Vue实现返回顶部按钮实例代码
2020/10/21 Javascript
在python的WEB框架Flask中使用多个配置文件的解决方法
2014/04/18 Python
Flask框架中密码的加盐哈希加密和验证功能的用法详解
2016/06/07 Python
matplotlib设置legend图例代码示例
2017/12/19 Python
Python实现将json文件中向量写入Excel的方法
2018/03/26 Python
python 使用pandas计算累积求和的方法
2019/02/08 Python
使用Python+wxpy 找出微信里把你删除的好友实例
2019/02/21 Python
使用python os模块复制文件到指定文件夹的方法
2019/08/22 Python
Numpy与Pytorch 矩阵操作方式
2019/12/27 Python
Python中logging日志库实例详解
2020/02/19 Python
浅谈Python __init__.py的作用
2020/10/28 Python
HTML5为输入框添加语音输入功能的实现方法
2017/02/06 HTML / CSS
马来西亚时装购物网站:ZALORA马来西亚
2017/03/14 全球购物
瑞士图书网站:Weltbild.ch
2019/09/17 全球购物
英国运动服、设备及配件网站:DW Sports
2019/12/04 全球购物
超市重阳节活动方案
2014/02/10 职场文书
《傅雷家书》教学反思
2014/04/20 职场文书
全家福照片寄语怎么写?
2019/04/02 职场文书