> 웹 프론트엔드 > JS 튜토리얼 > jquery_jquery에서 각각을 사용하는 방법에 대한 자세한 설명

jquery_jquery에서 각각을 사용하는 방법에 대한 자세한 설명

WBOY
풀어 주다: 2016-05-16 18:13:47
원래의
1335명이 탐색했습니다.

Each() 함수는 기본적으로 모든 프레임워크에서 제공하는 도구 함수입니다. 이를 통해 객체와 배열의 속성값을 순회하여 처리할 수 있습니다. jQuery와 jQuery 개체 모두 이 메서드를 구현합니다. jQuery 개체의 경우에는 각 메서드가 간단하게 위임됩니다. 즉, jQuery 개체는 jQuery의 각 메서드에 첫 번째 매개 변수로 전달됩니다. 즉, jQuery에서 제공하는 각 메서드는 다음의 모든 하위 요소입니다. 매개변수 1에 의해 제공된 객체는 하나씩 호출됩니다. jQuery 객체가 제공하는 각 메소드는 jQuery 내부의 하위 요소를 하나씩 호출합니다.

JQUERY의 핵심 코드

코드 복사 코드는 다음과 같습니다.

jQuery.prototype.each=function( fn, args ) {
return jQuery.each( this, fn, args )
}

jQuery에서 제공하는 각 메서드의 구체적인 구현을 살펴보겠습니다.
jQuery.each(obj,fn,arg)
이 메서드에는 세 가지 매개 변수가 있습니다. 즉, 연산할 개체 obj, 함수 fn입니다. 작동되고 함수 매개변수는 args입니다.
ojb 객체를 기준으로 살펴보겠습니다.

1. obj 객체는 배열입니다.
각 메서드는 배열의 하위 요소에 대해 하나씩 fn 함수를 호출합니다. 특정 하위 요소를 호출하여 반환된 결과는 false가 될 때까지입니다. 즉, 제공된 fn 함수로 이를 처리하고 특정 조건을 충족한 후 각 메서드 호출을 종료할 수 있습니다. 각 메소드가 arg 매개변수를 제공하는 경우 fn 함수 호출에 의해 전달된 매개변수는 arg입니다. 그렇지 않으면 하위 요소 인덱스, 하위 요소 자체
2.obj 객체가 배열이 아닙니다
이 메소드와 1의 가장 큰 차이점은 fn 메소드가 반환 값에 관계없이 하나씩 실행된다는 것입니다. 즉, fn 함수가 false를 반환하더라도 obj 객체의 모든 속성은 fn 메서드에 의해 호출됩니다. 호출에 전달된 매개변수는 1과 유사합니다.
코드 복사 코드는 다음과 같습니다.

jQuery.each=function( obj, fn , args ) {
if ( args ) {
if ( obj.length == 정의되지 않음 ){
for ( var i in obj )
fn.apply( obj, args )
}else{
for ( var i = 0, ol = obj.length; i < ol; i ) {
if ( fn.apply( obj, args ) === false )
break;
}
}
} else {
if ( obj.length == undefine ) {
for ( var i in obj )
fn.call( obj, i, obj ) ;
}else{
for ( var i = 0, ol = obj.length, val = obj[0]; i < ol && fn.call(val,i,val) !== false; val = obj [ i] ){}
}
}
return obj;
}

각 메서드에서 fn의 특정 호출 메서드에 유의해야 합니다. fn(i,val) 또는 fn(args)는 간단하지 않지만 fn.call(val,i,val) 또는 fn.apply(obj.args) 형식을 취합니다. 이는 fn의 자체 구현에서 이를 의미합니다. , 이 포인터를 직접 사용하여 배열이나 개체의 하위 요소를 참조할 수 있습니다. 이 방법은 대부분의 jQuery에서 사용되는 구현 방법입니다.

예를 통해 살펴보겠습니다

먼저 코드를 살펴보세요.
코드 복사 코드는 다음과 같습니다.

$("#submit").click(function(){
try{
$('#leftTbl tr').each(function (i){
var emailInput = $("#email_" (1 i))
if(!re.test(emailInput.val())){
alert("다음을 입력하세요. 올바르게 이메일을 보내세요");
emailInput.focus();
throw emailInput;
}else{
email = emailInput.val();
}
});
}catch(e){
return false;
}
$("#pageform").submit()
})

catch, counter도 만들 수 있습니다. 마지막으로 값을 판단해 보세요.

위 코드는 제목과 관련이 없는 것 같으니, 각각에 break와 continue를 구현하는 방법은 실제로 아래에 나와 있습니다. ...
코드 복사 코드는 다음과 같습니다.

$('input') .each(function(){
if($(this).val () == ''){
// 뭔가를 하세요
if(1==1)return false; // return 사용 루프를 종료하려면 false
else return true; // 다음 루프로 들어가려면
}
})

jquery에서 확인해야 합니다. 다음 요소를 계속 반복할지 여부를 결정하기 위해 각 요소를 반복한 후 반환된 값
원문, 재인쇄 시 표시해 주세요: Tongluba www.tlbar.com.cn
코드 복사 코드는 다음과 같습니다.

var arr = [ "하나", "둘", "셋", "넷"]
$.each(arr, function(){
alert(this);
})
//위 각각의 출력 결과는 다음과 같습니다. 1, 2, 3, 4
var arr1 = [[1, 4, 3], [4, 6, 6], [7 , 20, 9]]
$.each(arr1, function(i, item){
alert(item[0]);
})
//사실 arr1은 2입니다. -차원 배열, 항목은 각 1차원 배열을 취하는 것과 같습니다.
//item[0]은 각 1차원 배열의 첫 번째 값을 취하는 것과 같습니다
//위의 각 결과는 다음과 같습니다. 1 4 7
var obj = { 1:1, 2:2, 3:3, 4:4}
$.each(obj, function(key, val) {
alert(obj[ key] );
})
//이는 더욱 강력하며 모든 속성을 순환할 수 있습니다.
//출력 결과는 다음과 같습니다. 1 2 3 4
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿