jquery中each遍历对象和数组示例


Posted in Javascript onAugust 05, 2014

 通用遍历方法,可用于遍历对象和数组。$().each(),回调函数拥有两个参数:

第一个为对象的成员或数组的索引,第二个为对应变量或内容。如需退出each循环可使回调函数返回false

现有如下两个select

计划类别: 
<select id="PLANTYPE"> 
<option value="0">-所有-</option> 
<option value="1">新建</option> 
<option value="2">续建</option> 
</select> 
申报类型: 
<select id="AUDITTYPE"> 
<option value="0">-所有-</option> 
<option value="1">申报</option> 
<option value="2">修改</option> 
</select>

使用each方法获取option中的文本值,即 -所有-、新建、续建...

如果只使用一次each循环 可从option处开始

$("option").each(function(index,data){ 
console.info($( data ).text()); 
//或者console.info($(this).text()); 
})

也可从select处开始

$("select").each(function( index,data){ 
$("option", data).each(function(m,n){ 
console.info($(this).text()); 
}) 
})

$("option", data)一定要加上 data或者$("option",this),表示此对象下的option

否则就是所有的option。

--------------------------华丽的分割线-----------------------------

each还有一种用法jQuery.each(object, [callback])
不同于jQuery对象的$().each()方法,此方法可用于例遍任何对象。

用此方法同样遍历上述代码

$.each($("option"),function(index,data){ 
console.info(index+" "+data); 
})

也可以遍历数组

$.each( [0,1,2], function(i, n){ 
console.info( "Index:" + i + ": " + n ); 
});

遍历对象

$.each({ name: "itmyhome", addr: "Beijing" },function(i, n){ 
console.info("Name: " + i + ", Value: " + n); 
});
Javascript 相关文章推荐
利用javascript中的call实现继承
Jan 22 Javascript
JS Range HTML文档/文字内容选中、库及应用介绍
May 12 Javascript
jQuery文本框(input textare)事件绑定方法教程
Apr 24 Javascript
jQuery制作圣诞主题页面 更像是爱情影集
Aug 10 Javascript
用自定义图片代替原生checkbox实现全选,删除以及提交的方法
Oct 18 Javascript
基于vuejs+webpack的日期选择插件
May 21 Javascript
打字效果动画的4种实现方法(超简单)
Oct 18 Javascript
three.js加载obj模型的实例代码
Nov 10 Javascript
动态Axios的配置步骤详解
Jan 12 Javascript
4个顶级开源JavaScript图表库
Sep 29 Javascript
CKEditor 4.4.1 添加代码高亮显示插件功能教程【使用官方推荐Code Snippet插件】
Jun 14 Javascript
微信小程序 自定义复选框实现代码实例
Sep 04 Javascript
js 动态修改css文件的方法
Aug 05 #Javascript
JS实现关键字搜索时的相关下拉字段效果
Aug 05 #Javascript
js实现点击后将文字或图片复制到剪贴板的方法
Aug 04 #Javascript
JavaScript中的函数重载深入理解
Aug 04 #Javascript
window.print打印指定div指定网页指定区域的方法
Aug 04 #Javascript
jQuery 删除或是清空某个HTML元素示例
Aug 04 #Javascript
js实现正方形颜色从下往上升的效果
Aug 04 #Javascript
You might like
评分9.0以上的动画电影,剧情除了经典还很燃
2020/03/04 日漫
PHP 远程关机实现代码
2009/11/10 PHP
浅析php数据类型转换
2014/01/09 PHP
php设置允许大文件上传示例代码
2014/03/10 PHP
在PHP模板引擎smarty生成随机数的方法和math函数详解
2014/04/24 PHP
PHP类型约束用法示例
2016/09/28 PHP
简单JS代码压缩器
2006/10/12 Javascript
给moz-firefox下添加IE方法和属性
2007/04/10 Javascript
URL地址中的#符号使用说明
2011/02/12 Javascript
JQuery扩展插件Validate 2通过参数设置验证规则
2011/09/05 Javascript
JavaScript实现三阶幻方算法谜题解答
2014/12/29 Javascript
jQuery使用after()方法在元素后面添加多项内容的方法
2015/03/26 Javascript
谈谈我对JavaScript原型和闭包系列理解(随手笔记8)
2015/12/24 Javascript
解析JavaScript中的字符串类型与字符编码支持
2016/06/24 Javascript
JS及PHP代码编写八大排序算法
2016/07/12 Javascript
Angular2 多级注入器详解及实例
2016/10/30 Javascript
巧用weui.topTips验证数据的实例
2017/04/17 Javascript
Node.js服务器开启Gzip压缩教程
2017/08/11 Javascript
浅谈vue项目优化之页面的按需加载(vue+webpack)
2017/12/11 Javascript
尝试自己动手用react来写一个分页组件(小结)
2018/02/09 Javascript
Angular Renderer (渲染器)的具体使用
2018/05/03 Javascript
Python的Flask框架中集成CKeditor富文本编辑器的教程
2016/06/13 Python
python简单图片操作:打开\显示\保存图像方法介绍
2017/11/23 Python
python中的字典操作及字典函数
2018/01/03 Python
python多线程之事件Event的使用详解
2018/04/27 Python
详解python while 函数及while和for的区别
2018/09/07 Python
django rest framework serializer返回时间自动格式化方法
2020/03/31 Python
django日志默认打印request请求信息的方法示例
2020/05/17 Python
Julep官网:美容产品和指甲油
2017/02/25 全球购物
女方回门宴答谢词
2014/01/14 职场文书
小学教师年度个人总结
2015/02/05 职场文书
党支部季度考核意见
2015/06/02 职场文书
放假通知怎么写
2015/08/18 职场文书
2016年政治理论学习心得体会
2016/01/25 职场文书
Django实现WebSocket在线聊天室功能(channels库)
2021/09/25 Python
MySQL实现配置主从复制项目实践
2022/03/31 MySQL