jquery AJAX 성공 콜백에서 기능하도록 변수 전달

jquery AJAX 성공 콜백에서 기능하도록 변수 전달

jQuery AJAX 콜을 사용하여 이미지를 프리로드하려고 하는데 (url) 문자열을 AJAX 콜의 성공 함수 내에 있는 함수에 전달하는 데 문제가 있습니다(이것이 타당하다면).

현재 코드는 다음과 같습니다.

//preloader for images on gallery pages
window.onload = function() {
    setTimeout(function() {     
        var urls = ["./img/party/"]; //just one to get started

        for ( var i = 0; i < urls.length; i++ ) {
            $.ajax({
                url: urls[i],
                success: function(data,url) {
                    $(data).find("a:contains(.jpg)").each(function(url) {                               
                        new Image().src = url + $(this).attr("href");
                    });
                }
            });
        };  
    }, 1000);
};

url을 에 전달하려는 시도를 볼 수 있습니다(실패했습니다..each()콜 -url결국 정수 증가 값을 얻게 됩니다.이 파일들이 왜 어떤 관련이 있는지 확실하지 않은가? 아마도 jpg 파일의 수?

...원래 URL 배열의 단일 값을 사용합니다.

도와주셔서 감사합니다. 저는 항상 이 콜백에 약간 당황하는 것 같습니다.

---

프로그램?

그래서 @ron tornambe와 @PiSquared의 코멘트에 주의하면서 조금 곰곰이 생각해보고 현재 여기에 있습니다.

//preloader for images on gallery pages
window.onload = function() {
    var urls = ["./img/party/","./img/wedding/","./img/wedding/tree/"];

    setTimeout(function() {
        for ( var i = 0; i < urls.length; i++ ) {
            $.ajax({
                url: urls[i],
                success: function(data) {
                    image_link(data,i);
                    function image_link(data, i) {
                        $(data).find("a:contains(.jpg)").each(function(){ 
                            console.log(i);
                            new Image().src = urls[i] + $(this).attr("href");
                        });
                    }
                }
            });
        };  
    }, 1000);       
};

나는 그것을 넣으려고 했다.image_link(data, i)(각 중첩된 함수 등에서) 여기 및 모든 곳에서 동일한 결과를 얻을 수 있습니다.i는 3으로만 기록됩니다.제 생각에 이것은 모든 언급이i같은 것을 가리키고 비동기 태스크가 실제로 도달할 때까지image_link(data, i)그for...루프가 종료되고 (따라서 값은 3입니다)말할 필요도 없이 이것은urls[i]'displict'로 표시됩니다.

어떻게 하면 이 문제를 해결할 수 있을까요?

설정 개체는 해당 Ajax 호출에 연결되어 있으므로 인덱서를 사용자 지정 속성으로 추가할 수 있습니다. 그런 다음 다음을 사용하여 액세스할 수 있습니다.this콜백 성공 시:

//preloader for images on gallery pages
window.onload = function() {
    var urls = ["./img/party/","./img/wedding/","./img/wedding/tree/"];

    setTimeout(function() {
        for ( var i = 0; i < urls.length; i++ ) {
            $.ajax({
                url: urls[i],
                indexValue: i,
                success: function(data) {
                    image_link(data , this.indexValue);

                    function image_link(data, i) {
                        $(data).find("a:contains(.jpg)").each(function(){ 
                            console.log(i);
                            new Image().src = urls[i] + $(this).attr("href");
                        });
                    }
                }
            });
        };  
    }, 1000);       
};

편집: ECHO 엔드포인트 동작방식이 변경된 것 같기 때문에 갱신된 JSFiddle 예를 추가합니다.https://jsfiddle.net/djujx97n/26/

이 기능의 구조를 이해하려면 , http://api.jquery.com/jquery.ajax/, 에 있는 ajaxSettings 객체의 「filename」필드를 참조해 주세요.구체적인 주의사항은 다음과 같습니다.

「그것은,this모든 콜백 내의 참조는 설정에서 $.ajax에 전달되는 컨텍스트옵션의 오브젝트입니다.콘텍스트가 지정되지 않은 경우 Ajax 설정 자체를 참조합니다."

indexValue 속성을 사용하여 객체를 통해 여러 파라미터를 전달할 수도 있습니다.

var someData = "hello";

jQuery.ajax({
    url: "http://maps.google.com/maps/api/js?v=3",
    indexValue: {param1:someData, param2:"Other data 2", param3: "Other data 3"},
    dataType: "script"
}).done(function() {
    console.log(this.indexValue.param1);
    console.log(this.indexValue.param2);
    console.log(this.indexValue.param3);
}); 

다음과 같이 시도합니다(url을 가져오려면 this.url을 사용합니다).

$.ajax({
    url: 'http://www.example.org',
    data: {'a':1,'b':2,'c':3},
    dataType: 'xml',
    complete : function(){
        alert(this.url)
    },
    success: function(xml){
    }
});

여기서부터 가져가다

이러한 파라미터는 전달할 수 없습니다.성공 오브젝트는 하나의 파라미터로 익명함수에 매핑되며 수신된 데이터가 됩니다.for 루프 외부에 함수를 만듭니다.이 함수는(data, i)매개 변수로 지정하고 코드를 수행합니다.

function image_link(data, i) {
   $(data).find("a:contains(.jpg)").each(function(){                                
       new Image().src = url[i] + $(this).attr("href");
   }
}
...
success: function(data){
    image_link(data, i)
}

이렇게 하고 있습니다.

    function f(data,d){
    console.log(d);
    console.log(data);
}
$.ajax({
    url:u,
    success:function(data){ f(data,d);  }
});

혹시 도움이 될까 봐 비슷한 문제를 공유하기 위해 다음과 같은 방법을 사용했습니다.

var NextSlidePage = $("bottomcontent" + Slide + ".html");

부하 함수의 변수를 만들기 위해 사용했어야 했는데:

var NextSlidePage = "bottomcontent" + Slide + ".html";

★★★★★★★★★★★★★★★★★ $( )

왜 그랬는지 모르겠지만 이제 작동한다!감사합니다. 드디어 이 게시물에서 무엇이 잘못되었는지 알 수 있었습니다!

나는 최근에 그 문제를 만났다.이 문제는 파일 이름이 20자를 초과하면 발생합니다.따라서 바이패스는 파일 이름 길이를 변경하는 것이지만 이 트릭도 좋은 방법입니다.

$.ajaxSetup({async: false}); // passage en mode synchrone
$.ajax({
   url: pathpays,
   success: function(data) {
      //debug(data);
      $(data).find("a:contains(.png),a:contains(.jpg)").each(function() {
         var image = $(this).attr("href");
         // will loop through
         debug("Found a file: " + image);
         text +=  '<img class="arrondie" src="' + pathpays + image + '" />';
      });
      text = text + '</div>';
      //debug(text);
   }
});

자세한 조사 결과, 이 문제는 ajax 요청에서 비롯되었습니다.ajax가 반환하는html 코드를 확인합니다.

<a href="Paris-Palais-de-la-cite%20-%20Copie.jpg">Paris-Palais-de-la-c..&gt;</a>
</td>
<td align="right">2015-09-05 09:50 </td>
<td align="right">4.3K</td>
<td>&nbsp;</td>
</tr>

20 에 분할되어 있기 에, 20은 분할되어 .$(data).find("a:contains(.png))이치

, 이 href파라미터에는 파일의 풀네임이 포함되어 있습니다.

텍스트 영역에 있는 파일 이름 전체를 반환하도록 ajax에게 요청할 수 있는지 모르겠습니다.

명확해지기를 바랍니다.

모든 파일을 수집하는 데 적합한 테스트를 찾았습니다.

$(data).find("[href$='.jpg'],[href$='.png']").each(function() {  
var image = $(this).attr("href");

언급URL : https://stackoverflow.com/questions/18413969/pass-variable-to-function-in-jquery-ajax-success-callback