jquery动态添加以及遍历option并获取特定样式名称的option方法


Posted in jQuery onJanuary 29, 2018

实例如下所示:

<pre name="code" class="html"><script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
<select class="form-control" id='selectId'> 
<option class="all" value="0">全部</option> 
<option class="all" value="1">os2</option> 
<option>os2-anthonos</option> 
<option>os2-apps</option> 
<option>os2-centralpoint</option> 
<option>kf5-experimental</option> 
</select> 
<script> 
 //动态添加option 
 //$("#selectId").append("<option value='"+value+"'>"+text+"</option>"); 
 $(document).ready(function(){ 
 var string = ""; 
 $("#selectId option").each(function(){ //遍历全部option 
 var text = $(this).text(); //获取option的text 
 var value = $(this).val(); //获取option的value 
 if($(this).attr("class")=="all") 
  string +="{"+text+":"+value+"}"; 
 }); 
 alert(string.substring(0,string.length)); 
}); 
</script>

以上这篇jquery动态添加以及遍历option并获取特定样式名称的option方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
Vue.js列表渲染绑定jQuery插件的正确姿势
Jun 29 jQuery
jQuery菜单实例(全选,反选,取消)
Aug 28 jQuery
jquery 获取索引值在一定范围的列表方法
Jan 25 jQuery
详解jQuery中的isPlainObject()使用方法
Feb 27 jQuery
jQuery实现的电子时钟效果完整示例
Apr 28 jQuery
jQuery插件Validation表单验证详解
May 26 jQuery
jQuery实现的中英文切换功能示例
Jan 11 jQuery
通过JQuery,JQueryUI和Jsplumb实现拖拽模块
Jun 18 jQuery
基于jquery ajax的多文件上传进度条过程解析
Sep 11 jQuery
jquery ajax 请求小技巧实例分析
Nov 11 jQuery
jquery实现进度条状态展示
Mar 26 jQuery
jQuery实现广告显示和隐藏动画
Jul 04 jQuery
jQuery代码优化方法总结
Jan 29 #jQuery
jquery写出PC端轮播图实例
Jan 26 #jQuery
jquery根据name取得select选中的值实例(超简单)
Jan 25 #jQuery
用jquery获取select标签中选中的option值及文本的示例
Jan 25 #jQuery
jQuery zTree搜索-关键字查询 递归无限层功能实现代码
Jan 25 #jQuery
使用Ajax和Jquery配合数据库实现下拉框的二级联动的示例
Jan 25 #jQuery
解决Jquery下拉框数据动态获取的问题
Jan 25 #jQuery
You might like
实例讲解PHP表单
2020/06/10 PHP
用cookies实现的可记忆的样式切换效果代码下载
2007/12/24 Javascript
struts2 jquery 打造无限层次的树
2009/10/23 Javascript
基于jQuery的弹出消息插件 DivAlert之旅(一)
2010/04/01 Javascript
JQuery优缺点分析说明
2011/04/10 Javascript
javascript中定义私有方法说明(private method)
2014/01/27 Javascript
jQuery插件实现多级联动菜单效果
2015/12/01 Javascript
Javascript中的Prototype到底是什么
2016/02/16 Javascript
Bootstrap组件系列之福利篇几款好用的组件(推荐二)
2016/07/12 Javascript
JS关闭窗口时产生的事件及用法示例
2016/08/20 Javascript
基于jQuery Easyui实现登陆框界面
2017/07/10 jQuery
React-Native实现ListView组件之上拉刷新实例(iOS和Android通用)
2017/07/11 Javascript
vue 项目常用加载器及配置详解
2018/01/22 Javascript
JavaScript数据结构与算法之二叉树添加/删除节点操作示例
2019/03/01 Javascript
js实现秒表计时器
2019/12/16 Javascript
CentOS安装pillow报错的解决方法
2016/01/27 Python
推荐10款最受Python开发者欢迎的Python IDE
2018/09/16 Python
python reverse反转部分数组的实例
2018/12/13 Python
python中for循环把字符串或者字典添加到列表的方法
2019/07/20 Python
python 用 xlwings 库 生成图表的操作方法
2019/12/22 Python
Python venv虚拟环境配置过程解析
2020/07/08 Python
python工具——Mimesis的简单使用教程
2021/01/16 Python
html5 canvas 画图教程案例分析
2012/11/23 HTML / CSS
英国最大的香水商店:The Fragrance Shop
2018/07/06 全球购物
Tommy Hilfiger美国官网:美国高端休闲领导品牌
2019/01/14 全球购物
Feelunique德国官方网站:欧洲最大的在线美容零售商
2019/07/20 全球购物
android面试问题与答案
2016/12/27 面试题
工程师自我评价怎么写
2013/09/19 职场文书
土木工程应届生求职信
2013/10/31 职场文书
土木工程专业推荐信
2014/02/19 职场文书
我的求职择业计划书
2014/04/04 职场文书
商务英语专业毕业生求职信
2014/07/06 职场文书
小学生勤俭节约演讲稿
2014/08/28 职场文书
爱牙日活动总结
2014/08/29 职场文书
学习保证书怎么写
2015/02/26 职场文书
加班费申请报告
2015/05/15 职场文书