jQuery 요소 ID를 늘리는 방법

Question

jPlayer (jquery 오디오 플레이어)의 인스턴스 : jPlayer1, jPlayer2, jPlayer3, jPlayer4, 각각 오디오 파일로 초기화되고 미리로드됩니다.

아래 함수를 호출하면 기존 배열을 탐색하고 미리로드 된 오디오를 재생하는 메서드를 추가합니다.

function addPlayAudioMethodToExerciseArray(){ 
    for (i in qaArray){ 
     qaArray[i].playAnswer = function(){ $('#jPlayer'+i).jPlayer('play',0);} 
    } 
} 

그것은 부분 ('#의 jPlayer'+ I)를 제외한 괜찮다 방법 작성은 ('# jPlayer1') ('# jPlayer2') 등

많은되고 평가되지 미리 감사드립니다. 참고 : 저는 멍청 해요.

Answer 1

문제는 모든 "playAnswer"기능이 모두 동일한 "i"변수를 감싸는 것입니다. 즉, 단 하나의 "i"가 있습니다 (이 경우에는 var으로 선언하지 않았으므로 전역입니다).

다른 함수를 사용하면 각 콜백마다 별도의 "i"를 제공 할 수 있습니다.

function addPlayAudioMethodToExerciseArray(){ 
    function makePlayerCallback(i) { 
     return function() { 
     $('#jPlayer' + i).jPlayer('play', 0); 
     }; 
    } 

    for (var i = 0; i < qaArray.length; ++i){ 
     qaArray[i].playAnswer = makePlayerCallback(i); 
    } 
} 

은 "makePlayerCallback"기능 효과적으로 지방 인 것을 기능, 자신의 "I"가 개별적으로 콜백 기능을 초래할 자체 파라미터 "I"를 갖는다. 이 함수를 호출 할 때마다 반환 된 콜백 함수를 "클로저 (closure)"라고합니다. (내 루프가 0부터 시작한다는 점에 유의하십시오. HTML의 식별자가 1부터 시작한다면, 어딘가에 1을 추가하여 계정을 처리해야합니다 .DeVarDump 덕분에 그 주를 알 수 있습니다.)

"i"는 루프에서 var으로 사용하여 "addPlayAudioMethodToExerciseArray"(긴 함수 이름 인 소년 : 너무 자주 입력하지 않아도 됨 :-)로 로컬로 만듭니다. 또한 "qaArray"는 실제로 정직에서 고쉬한 배열이고 n 객체가 아니라는 가정하에 숫자 인덱스로 사용했습니다. 배열에 숫자 인덱싱을 사용하는 것이 좋습니다.

Answer 2

사용 colsures

이 시도 :

for(i in qaArray) 
    { 
     qaArray[i].playAnswer = function (num) 
     { 
      return function() 
      { 
       $('#jPlayer' + num).jPlayer('play', 0); 
      } ; 
     }(i) 
    };