JQuery 获取多个select标签option的text内容(实例)


Posted in jQuery onSeptember 07, 2017

根据option的id属性,修改text值

$("#sel_div .select_class option[id='-选择省-']").text(data.province).attr("selected",true);
 $("#sel_div .select_class option[id='-选择市-']").text( data.city).attr("selected",true);
 $("#sel_div .select_class option[id='-选择区-']").text( data.area).attr("selected",true);
 $("#sel_div .select_class option[id='-选择街-']").text( data.street).attr("selected",true);

获取多个select(使用class属性,切值相同)下的所有option的text值

$("#sel_div .select_class option").each(function(){ //遍历所有option标签

   var text = $(this).text(); //获取option的text
   alert(text);//显示的是当前这个option的text值
 if(txt == "选择省")
     $("#sel_div .select_class option[id='-选择省-']").text(data.province).attr("selected",true);
   if(txt == "选择市")
     $("#sel_div .select_class option[id='-选择市-']").text( data.city).attr("selected",true);
   if(txt == "选择区")
     $("#sel_div .select_class option[id='-选择区-']").text( data.area).attr("selected",true);
  if(txt == "选择街")
     $("#sel_div .select_class option[id='-选择街-']").text( data.street).attr("selected",true);

 });

如果select中间没有级联关系,那么所有的option都已经加载,可以使用下面的方法显示查询出来的数据

$("#sel_div .select_class option[id="+data.province+"]").attr("selected",true);
$("#sel_div .select_class option[id="+data.city+"]").attr("selected",true);
$("#sel_div .select_class option[id="+data.area+"]").attr("selected",true);
$("#sel_div .select_class option[id="+data.street+"]").attr("selected",true);

另一种获取所有option的方法,相当于将所有text拼成字符串,把每个字符存进map中

var map = $("#sel_div .select_class option").map(function(){

    alert($(this).text());//显示单个option的text  text1

    return $(this).text();
  }).get().join(",");

alert(map);//显示的是 text1,text2,text3
alert(map[0]);//显示 t

在上面的基础上进行改进,使用array数组存放查询出来的数据,在使用for循环可以对数据进行操作

var array = new Array();
  $("#leaf .form-control option").map(function(){
    array.push($(this).text());
  })
  for(var i = 0; i < array.length; i ++ ){
    alert(array[i]);//显示每个option的text  text1,text2,text3
  }

以上这篇JQuery 获取多个select标签option的text内容(实例)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
使用jQuery ajaxupload插件实现无刷新上传文件
Apr 23 jQuery
使用jQuery.Pin垂直滚动时固定导航
May 24 jQuery
浅谈struts1 &amp; jquery form 文件异步上传
May 25 jQuery
jQueryMobile之窗体长内容的缺陷与解决方法实例分析
Sep 20 jQuery
利用jQuery实现简单的拖曳效果实例代码
Oct 20 jQuery
jQuery实现的简单前端搜索功能示例
Oct 28 jQuery
jquery实现侧边栏左右伸缩效果的示例
Dec 19 jQuery
基于jquery trigger函数无法触发a标签的两种解决方法
Jan 06 jQuery
jquery实现的简单轮播图功能【适合新手】
Aug 17 jQuery
jQuery序列化form表单数据为JSON对象的实现方法
Sep 20 jQuery
jQuery pager.js 插件动态分页功能实例分析
Aug 02 jQuery
JQuery通过键盘控制键盘按下与松开触发事件
Aug 07 jQuery
jQuery UI Draggable + Sortable 结合使用(实例讲解)
Sep 07 #jQuery
jQueryUI Sortable 应用Demo(分享)
Sep 07 #jQuery
jQuery实现的弹幕效果完整实例
Sep 06 #jQuery
jQuery实现的文字逐行向上间歇滚动效果示例
Sep 06 #jQuery
jquery实现限制textarea输入字数的方法
Sep 06 #jQuery
jquery实现用户登陆界面(示例讲解)
Sep 06 #jQuery
jQuery实现注册会员时密码强度提示信息功能示例
Sep 05 #jQuery
You might like
如何跨站抓取别的站点的页面的补充
2006/10/09 PHP
PHP 开发工具
2006/12/06 PHP
详解PHP函数 strip_tags 处理字符串缺陷bug
2017/06/11 PHP
Laravel框架用户登陆身份验证实现方法详解
2017/09/14 PHP
用js自动判断浏览器分辨率的代码
2007/01/28 Javascript
Code:loadScript( )加载js的功能函数
2007/02/02 Javascript
Flash+XML滚动新闻代码 无图片 附源码下载
2007/11/22 Javascript
IE8 中使用加速器(Activities)
2010/05/14 Javascript
jquery批量控制form禁用的代码
2013/08/06 Javascript
javascript打印html内容功能的方法示例
2013/11/28 Javascript
JavaScript设计模式之工厂模式和构造器模式
2015/02/11 Javascript
详解jquery事件delegate()的使用方法
2016/01/25 Javascript
Bootstrap缩略图与警告框学习使用
2017/02/08 Javascript
微信小程序使用input组件实现密码框功能【附源码下载】
2017/12/11 Javascript
swiper在vue项目中loop循环轮播失效的解决方法
2018/09/15 Javascript
vant时间控件使用方法详解
2020/12/24 Javascript
python写的一个文本编辑器
2014/01/23 Python
Python内置函数之filter map reduce介绍
2014/11/30 Python
Python函数参数类型*、**的区别
2015/04/11 Python
python下MySQLdb用法实例分析
2015/06/08 Python
Python3.6正式版新特性预览
2016/12/15 Python
python django生成迁移文件的实例
2019/08/31 Python
pandas将多个dataframe以多个sheet的形式保存到一个excel文件中
2019/10/10 Python
Python 为什么推荐蛇形命名法原因浅析
2020/06/18 Python
深入了解Python装饰器的高级用法
2020/08/13 Python
python 实现压缩和解压缩的示例
2020/09/22 Python
纯css3制作网站后台管理面板
2014/12/30 HTML / CSS
html5调用摄像头功能的实现代码
2018/05/07 HTML / CSS
车贷收入证明范本
2014/01/09 职场文书
个人四风对照检查材料
2014/09/26 职场文书
《认识钟表》教学反思
2016/02/16 职场文书
MySQL 角色(role)功能介绍
2021/04/24 MySQL
Django显示可视化图表的实践
2021/05/10 Python
python数据可视化JupyterLab实用扩展程序Mito
2021/11/20 Python
避坑之 JavaScript 中的toFixed()和正则表达式
2022/04/19 Javascript
Django框架之路由用法
2022/06/10 Python