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 相关文章推荐
jQuery插件FusionWidgets实现的Cylinder图效果示例【附demo源码】
Mar 23 jQuery
jQuery插件FusionWidgets实现的AngularGauge图效果示例【附demo源码】
Mar 23 jQuery
jQuery Masonry瀑布流布局神器使用详解
May 25 jQuery
jQueryeasyui 中如何使用datetimebox 取两个日期间相隔的天数
Jun 13 jQuery
jQuery实现导航栏头部菜单项点击后变换颜色的方法
Jul 19 jQuery
jQuery Ajax向服务端传递数组参数值的实例代码
Sep 03 jQuery
JQuery Ajax动态加载Table数据的实例讲解
Aug 09 jQuery
jQuery模拟12306城市选择框功能简单实现方法示例
Aug 13 jQuery
JQuery的加载和选择器用法简单示例
May 13 jQuery
jQuery创建折叠式菜单
Jun 15 jQuery
jQuery中DOM常见操作实例小结
Aug 01 jQuery
jQuery实现checkbox全选、反选及删除等操作的方法详解
Aug 02 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数据库类
2009/05/27 PHP
php一次性删除前台checkbox多选内容的方法
2013/09/22 PHP
如何通过View::first使用Laravel Blade的动态模板详解
2017/09/21 PHP
php和nginx交互实例讲解
2019/09/24 PHP
js继承 Base类的源码解析
2008/12/30 Javascript
JavaScript URL参数读取改进版
2009/01/16 Javascript
js 函数调用模式小结
2011/12/26 Javascript
JS弹出窗口代码大全(详细整理)
2012/12/21 Javascript
使用JS CSS去除IE链接虚线框的三种方法
2013/11/14 Javascript
JavaScript将数据转换成整数的方法
2014/01/04 Javascript
this,this,再次讨论javascript中的this,超全面(经典)
2016/01/05 Javascript
需要牢记的JavaScript基础知识
2016/09/25 Javascript
node.js版本管理工具n无效的原理和解决方法
2016/11/24 Javascript
详解nodeJS之二进制buffer对象
2017/06/03 NodeJs
浅谈MUI框架中加载外部网页或服务器数据的方法
2018/01/31 Javascript
详解如何在webpack中做预渲染降低首屏空白时间
2018/08/22 Javascript
关于layui toolbar和template的结合使用方法
2019/09/19 Javascript
详解vue组件之间的通信
2020/08/30 Javascript
[01:57]2016完美“圣”典风云人物:国士无双专访
2016/12/04 DOTA
[52:27]2018DOTA2亚洲邀请赛 3.31 小组赛B组 paiN vs Secret
2018/04/01 DOTA
使用Python进行新浪微博的mid和url互相转换实例(10进制和62进制互算)
2014/04/25 Python
python爬虫之xpath的基本使用详解
2018/04/18 Python
对Python中的@classmethod用法详解
2018/04/21 Python
Python功能点实现:函数级/代码块级计时器
2019/01/02 Python
Django Rest framework认证组件详细用法
2019/07/25 Python
Python3分析处理声音数据的例子
2019/08/27 Python
Python实现弹球小游戏
2020/08/01 Python
Python安装Bs4的多种方法
2020/11/28 Python
使用Python爬虫爬取小红书完完整整的全过程
2021/01/19 Python
小米旗下精品生活电商平台:小米有品
2018/12/18 全球购物
控制工程专业个人求职信
2013/09/25 职场文书
高校学生干部的自我评价分享
2013/11/04 职场文书
2015年教研组工作总结
2015/05/04 职场文书
推销搭讪开场白
2015/05/28 职场文书
感谢师恩主题班会
2015/08/17 职场文书
2016年过年放假安排通知
2015/08/18 职场文书