jQuery는 작동하지만, 성공, [object Object]가 브라우저에 나타나기 시작합니다.

Question

사전에 사과하는 것이 아주 분명하다면, 나는이 모든 것에 상당히 새로운 중학교 개발자입니다! jQuery을 사용 중이며 두 개의 서로 다른 URL (도메인 간 문제 없음)에 요청을 보내고있는 함수가 있고 get 요청이 완료되면 .done()을 사용하여 함수를 진행합니다. 본질적으로 모든 것이 정상적으로 작동하지만, 브라우저에 표시됩니다 (success, [object Object] (twice)). 아래의 전체 스크립트를 $.ajax()의 .done() 콜백 ($.get()이 $.ajax({ method: "get", ... }) 단지 바로 가기입니다) 세 개의 인수

`

$(document).ready(function() { 
    var currentPageLink = window.location.href, 
      varToCheckStaging = new RegExp(/(stagin)\w+/), 
      newPathString1 = '', 
      newPathString2 = ''; 

    if (varToCheckStaging.test(currentPageLink)) { 
     newPathString1 = "myurl1"; 
     newPathString2 = "myurl2"; 

    } else { 
     newPathString1 = "myotherurl1"; 
     newPathString2 = "myotherurl2"; 
    } 

    var getData = (function() { 

     $.when($.get(newPathString1), $.get(newPathString2)).done(function (data1, data2) { 

      var newProducts = (data1 + data2); 
      var $products = $("#products"), 
        str = newProducts, 
        html = $.parseHTML(str); 

      $products.append(html); 

      $('.product-tile').each(function() { 
       $(this).appendTo('.carousel_item'); 
      }); 
      $('.grid-tile').remove(); 
      $("a.product-link").replaceWith("<a class='custom_text_cta'>SHOP NOW</a>"); 

      $(".carousel_item").slick({ 
       speed: 1000, 
       dots: false, 
       arrows: true, 
       infinite: true, 
       appendArrows: '.carousel_item', 
       prevArrow: '<i class="fa fa-angle-left fa-3x" aria-hidden="true"></i>', 
       nextArrow: '<i class="fa fa-angle-right fa-3x" aria-hidden="true"></i>', 
       autoplay: true, 
       autoplaySpeed: 5000, 
       slidesToShow: 4, 
       responsive: [{ 
        breakpoint: 1366, 
        settings: { 
         slidesToShow: 4 
        } 
       }, { 
        breakpoint: 1024, 
        settings: { 
         slidesToShow: 3, 
         draggable: true, 
         swipe: true 
        } 
       }, { 

        breakpoint: 767, 
        settings: { 
         slidesToShow: 2, 
         arrows: true, 
         dots: false, 
         draggable: true, 
         swipe: true 
        } 
       }, { 
        breakpoint: 480, 
        settings: { 
         slidesToShow: 1 
        } 
       }] 
      }); 

     }); 
    }); 
    getData(); 

}); 

Answer 1

라고 : 이제 data, statusText, jqXHR

의이 부분 documentation for $.when()은 관련성이 있습니다.

Deferred가 값없이 해결 된 경우 해당하는 doneCallback 인수가 정의되지 않습니다. Deferred가 단일 값으로 해석되면 해당 인수가 해당 값을 보유합니다. Deferred가 여러 값으로 해석되는 경우 해당 인수는 해당 값의 배열이됩니다. 예를 들어 스크립트에 조준

는

var d1 = $.Deferred(); 
var d2 = $.Deferred(); 
var d3 = $.Deferred(); 

$.when(d1, d2, d3).done(function (v1, v2, v3) { 
    console.log(v1); // v1 is undefined 
    console.log(v2); // v2 is "abc" 
    console.log(v3); // v3 is an array [ 1, 2, 3, 4, 5 ] 
}); 

d1.resolve(); 
d2.resolve("abc"); 
d3.resolve(1, 2, 3, 4, 5); 

,이 data1 및 data2 요소로 .done() 콜백의 세 가지 매개 변수를 포함하는 배열된다는 것을 의미합니다.

var newProducts = (data1 + data2); 

에 :

data1[0]는 data2[0]가

그래서 당신은 다음 줄을 변경해야합니다 두 번째 $.get() 호출의 data 일부가 될 첫번째 $.get() 호출의 data 일부가 될 것입니다 :

var newProducts = (data1[0] + data2[0]);