当前位置: 首页 > 中文手册 > 全局jQuery.each() 函数详解

全局jQuery.each() 函数详解

jQuery.each()函数用于遍历指定的对象和数组,并以对象的每个属性(或数组的每个成员)作为上下文来遍历执行指定的函数。

所谓的上下文,意即该函数内部的this指针引用了该元素。

该函数属于全局jQuery对象。请注意,这与jQuery对象(实例)的each()函数不同。

语法

静态函数jQuery.each()的语法如下:

jQuery.each( object, callback )

参数

参数描述
objectObject类型指定需要遍历的对象或数组。
callbackFunction类型指定的用于循环执行的函数。

参数object可以是对象或数组。如果是对象,则遍历该对象的每个属性;如果是数组,则遍历该数组中的每个元素。

jQuery.each()函数将根据每个成员(对象的属性或数组的元素)循环调用函数callback。每次调用函数callback时,jQuery.each()函数都会将callback函数内部的this引用指向当前正在迭代的成员,并为其传入两个参数。第一个参数是当前迭代成员在对象或数组中的索引值(从0开始计数),第二个参数是当前迭代成员(与this的引用相同)。

jQuery.each()函数还会根据每次调用函数callback的返回值来决定后续动作。如果返回值为false,则停止循环(相当于普通循环中的break);如果返回其他任何值,均表示继续执行下一个循环。

返回值

jQuery.each()方法的返回值为jQuery类型,返回当前jQuery对象本身。

示例&说明

使用jQuery.each()函数迭代对象或数组,jQuery示例代码如下:

// 遍历数组元素
$.each( [1, 2, 3] , function(i, item){
	alert("索引=" + i + "; 元素=" + item);	
} );

// 遍历对象属性
$.each( { name: "张三", age: 18 } , function(property, value){
	alert("属性名=" + property + "; 属性值=" + value);	
} );

var array = [];
array[2] = "Code";
array[4] = "Player";
// 会遍历索引为0、1、2、3、4的元素,其中0、1、3的元素是undefined
$.each( array , function(i, item){
	alert("索引=" + i + "; 元素=" + item);	
} );

jQuery.each()函数同样可以遍历jQuery对象中匹配的元素,以下面这段HTML代码为例:

<div id="n1">
	<div id="n2">
		<ul id="n3">
			<li id="n4">item1</li>
			<li id="n5">item2</li>
			<li id="n6">item3</li>
		</ul>
	</div>	
</div>
<form id="demoForm">
	<input name="goods_weight" type="checkbox" value="20">A(20kg)<br>
	<input name="goods_weight" type="checkbox" value="33">B(33kg)<br>
	<input name="goods_weight" type="checkbox" value="36">C(36kg)<br>
	<input name="goods_weight" type="checkbox" value="49">D(49kg)<br>
	<input name="goods_weight" type="checkbox" value="56">E(56kg)<br>
	<input name="goods_weight" type="checkbox" value="78">F(78kg)<br>
	<input id="btnBuy" type="button" value="订购">	
</form>

现在,我们将所有的<li>元素的innerHTML改为"编号n"(n为1、2、3……)。

$.each( $("ul li"), function(index, element){
	// this === element
	$(element).html( "编号" + (index + 1) );	
});

接着,我们注册【订购】按钮的点击事件,用于处理商品订购事务,要求每次订购的商品重量不得超过100kg,否则无法订购并提示相应信息。

$("#btn").click(function(){
	var weight = 0;
	$.each( $("[name=goods_weight]:checked"), function(){
		weight += parseInt(this.value);
		if(weight > 100){
			return false;
		}
	});
	if(weight <= 0){
		alert("没有选择任何商品!");
	}else if(weight > 100){
		alert("一次订购的商品重量不能超过100kg!");
	}else{
		// 订购商品
		alert("订购商品成功!");
	}
});

运行代码

35 1
我们认为: 用户的主要目的,是为了获取有用的信息,而不是来点击广告的。因此本站将竭力做好内容,并将广告和内容进行分离,确保所有广告不会影响到用户的正常阅读体验。用户仅凭个人意愿和兴趣爱好点击广告。
我们坚信:只有给用户带来价值,用户才会给我们以回报。
CodePlayer技术交流群1CodePlayer技术交流群1

帮朋友打一个硬广告:

P2P网贷系统(Java版本) 新年低价大促销,多年P2P技术积累,系统功能完善(可按需定制,可支持第三方存管、银行存管),架构稳定灵活、性能优异、二次开发快速简单。 另可提供二次开发、安装部署、售后维护、安全培训等一条龙服务。

外行看热闹,内行看门道。可以自信地认为,在系统设计上,比市面上的晓风、迪蒙、方维、绿麻雀、国融信、金和盛等P2P系统要好。
深圳地区支持自带技术人员现场考察源代码、了解主要技术架构,货比三家,再决定是否购买。

也可推荐他人购买,一旦完全成交,推荐人可获得实际售价 10% 的返现。
有意向者,详情请 点击这里 联系,工作时间立即回复。