jQuery.each()用法分享


Posted in Javascript onJuly 31, 2012

例遍数组,同时使用元素索引和内容。(i是索引,n是内容)

$.each( [0,1,2], function(i, n){ 
alert( "Item #" + i + ": " + n ); 
});

例遍对象,同时使用成员名称和变量内容。(i是成员名称,n是变量内容)
$.each( { name: "John", lang: "JS" }, function(i, n){ 
alert( "Name: " + i + ", Value: " + n ); 
});

例遍dom元素,此处以一个input表单元素作为例子。

如果你dom中有一段这样的代码
<input name="aaa" type="hidden" value="111" />
<input name="bbb" type="hidden" value="222" />
<input name="ccc" type="hidden" value="333" />
<input name="ddd" type="hidden" value="444"/>
然后你使用each如下

$.each($("input:hidden"), function(i,val){ 
alert(val); //输出[object HTMLInputElement],因为它是一个表单元素。 
alert(i); //输出索引为0,1,2,3 
alert(val.name); //输出name的值 
alert(val.value); //输出value的值 
});

以下是官方的解释:

jQuery.each(object, [callback])

概述
通用例遍方法,可用于例遍对象和数组。

不同于例遍 jQuery 对象的 $().each() 方法,此方法可用于例遍任何对象。回调函数拥有两个参数:第一个为对象的成员或数组的索引,第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false,其它返回值将被忽略。

参数
objectObject
需要例遍的对象或数组。

callback (可选)Function
每个成员/元素执行的回调函数。

Javascript 相关文章推荐
jquery 多级下拉菜单核心代码
May 21 Javascript
疯狂Jquery第一天(Jquery学习笔记)
May 11 Javascript
使用js画图之画切线
Jan 12 Javascript
bootstrap网页框架的使用方法
May 10 Javascript
JS敏感词过滤代码
Dec 23 Javascript
移动端Ionic App 资讯上下循环滚动的实现代码(跑马灯效果)
Aug 29 Javascript
使用JavaScript实现node.js中的path.join方法
Aug 12 Javascript
微信小程序自定义组件的实现方法及自定义组件与页面间的数据传递问题
Oct 09 Javascript
在小程序Canvas中使用measureText的方法示例
Oct 19 Javascript
Element-UI+Vue模式使用总结
Jan 02 Javascript
Vue 中 template 有且只能一个 root的原因解析(源码分析)
Apr 11 Javascript
VUE UPLOAD 通过ACTION返回上传结果操作
Sep 07 Javascript
artDialog 4.1.5 Dreamweaver代码提示/补全插件 附下载
Jul 31 #Javascript
JavaScript中的私有/静态属性介绍
Jul 26 #Javascript
13 个JavaScript 性能提升技巧分享
Jul 26 #Javascript
了解一点js的Eval函数
Jul 26 #Javascript
基于jquery实现的一个选择中国大学的弹框 (数据、步骤、代码)
Jul 26 #Javascript
javascript小组件 原生table排序表格脚本(兼容ie firefox opera chrome)
Jul 25 #Javascript
浅谈javascript的原型继承
Jul 25 #Javascript
You might like
PHP实现图片裁剪、添加水印效果代码
2014/10/01 PHP
跟我学Laravel之请求(Request)的生命周期
2014/10/15 PHP
Thinkphp自定义代码生成工具及用法说明(附下载地址)
2016/05/27 PHP
Laravel使用PHPQRCODE实现生成带有LOGO的二维码图片功能示例
2017/07/07 PHP
laravel批量生成假数据的方法
2019/10/09 PHP
php 利用socket发送GET,POST请求的实例代码
2020/07/04 PHP
textarea焦点的用法实现获取焦点清空失去焦点提示效果
2014/05/19 Javascript
BOOTSTRAP时间控件显示在模态框下面的bug修复
2015/02/05 Javascript
JavaScript中常见的字符串操作函数及用法汇总
2015/05/04 Javascript
Javascript控制div属性动态变化实例分析
2015/10/08 Javascript
Vue2.0表单校验组件vee-validate的使用详解
2017/05/02 Javascript
Kindeditor单独调用多图上传实例
2017/07/31 Javascript
Js利用Canvas实现图片压缩功能
2017/09/13 Javascript
vux uploader 图片上传组件的安装使用方法
2018/05/15 Javascript
JavaScript设计模式之模板方法模式原理与用法示例
2018/08/07 Javascript
原生JS实现$.param() 函数的方法
2018/08/10 Javascript
怎样使你的 JavaScript 代码简单易读(推荐)
2019/04/16 Javascript
vue控制多行文字展开收起的实现示例
2019/10/11 Javascript
Vue.extend 编程式插入组件的实现
2019/11/18 Javascript
vue 实现一个简单的全局调用弹窗案例
2020/09/10 Javascript
在Python的Django框架中显示对象子集的方法
2015/07/21 Python
NumPy 数学函数及代数运算的实现代码
2018/07/18 Python
python实现从pdf文件中提取文本,并自动翻译的方法
2018/11/28 Python
Python实现的矩阵转置与矩阵相乘运算示例
2019/03/26 Python
wxPython修改文本框颜色过程解析
2020/02/14 Python
python 工具 字符串转numpy浮点数组的实现
2020/03/14 Python
使用python自动追踪你的快递(物流推送邮箱)
2020/03/17 Python
解决tensorflow读取本地MNITS_data失败的原因
2020/06/22 Python
Flask中jinja2的继承实现方法及实例
2021/03/03 Python
HTML5 canvas基本绘图之绘制矩形
2016/06/27 HTML / CSS
法务专员岗位职责
2014/01/02 职场文书
大课间体育活动方案
2014/03/12 职场文书
五水共治一句话承诺
2014/05/30 职场文书
记账会计岗位职责
2014/06/16 职场文书
无工作证明怎么写
2015/06/15 职场文书
css清除浮动clearfix:after的用法详解(附完整代码)
2023/05/21 HTML / CSS