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插件FusionCharts绘制2D环饼图效果示例【附demo源码】
Apr 10 jQuery
jQuery中hover方法搭配css的hover选择器,实现选中元素突出显示方法
May 08 jQuery
jQuery实现select下拉框获取当前选中文本、值、索引
May 08 jQuery
使用jQuery实现页面定时弹出广告效果
Aug 24 jQuery
jquery在启动页面时,自动加载数据的实例
Jan 22 jQuery
jQuery实现基本淡入淡出效果的方法详解
Sep 05 jQuery
jQuery使用each遍历循环的方法
Sep 19 jQuery
jQuery each和js forEach用法比较
Feb 27 jQuery
jQuery实现全选、反选和不选功能的方法详解
Dec 04 jQuery
JQuery事件委托(适用于给动态生成的脚本元素添加事件)
Feb 01 jQuery
jQuery实现朋友圈查看图片
Sep 11 jQuery
html中两种获取标签内的值的方法
Jun 16 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
《被神捡到的男人》动画化计划进行中!
2020/03/06 日漫
mysql5详细安装教程
2007/01/15 PHP
PHP设计模式之迭代器模式的深入解析
2013/06/13 PHP
PHP中利用sleep函数实现定时执行功能实现代码
2016/08/25 PHP
PHP正则匹配到2个字符串之间的内容方法
2018/12/24 PHP
JavaScript禁止页面操作的示例代码
2013/12/17 Javascript
jquery实现的下拉和收缩效果示例
2014/08/21 Javascript
JS实现常见的TAB、弹出层效果(TAB标签,斑马线,遮罩层等)
2015/10/08 Javascript
AngularJS开发教程之控制器之间的通信方法分析
2016/12/25 Javascript
微信小程序 tabs选项卡效果的实现
2017/01/05 Javascript
input框中自动展示当前日期yyyy/mm/dd的实现方法
2017/07/06 Javascript
vue-router配合ElementUI实现导航的实例
2018/02/11 Javascript
jQuery实现根据身份证号获取生日、年龄、性别等信息的方法
2019/01/09 jQuery
详解vue-cli3 中跨域解决方案
2019/04/10 Javascript
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
2019/05/27 jQuery
vue实现鼠标经过动画
2019/10/16 Javascript
webpack DllPlugin xxx is not defined解决办法
2019/12/13 Javascript
js 计算月/周的第一天和最后一天代码
2020/02/01 Javascript
Python3数字求和的实例
2019/02/19 Python
python实现AES加密与解密
2019/03/28 Python
Python使用os.listdir()和os.walk()获取文件路径与文件下所有目录的方法
2019/04/01 Python
python如何随机生成高强度密码
2020/08/19 Python
pycharm 2020 1.1的安装流程
2020/09/29 Python
手把手教你实现一个canvas智绘画板的方法
2019/03/04 HTML / CSS
杭州信雅达系统.NET工程师面试试题
2015/02/08 面试题
UNIX特点都有哪些
2016/04/05 面试题
怎么样写好简历中的自我评价
2013/10/25 职场文书
汽车销售顾问求职自荐信
2014/01/01 职场文书
大学生如何写自荐信
2014/01/08 职场文书
法学函授自我鉴定
2014/02/06 职场文书
教师业务培训方案
2014/05/01 职场文书
2015上半年个人工作总结
2015/07/27 职场文书
新教师教学工作总结
2015/08/12 职场文书
《为人民服务》教学反思
2016/02/20 职场文书
读《工匠精神》有感:热爱工作,精益求精
2019/12/28 职场文书
CSS 文字装饰 text-decoration & text-emphasis 详解
2021/04/06 HTML / CSS