Я хочу использовать переменную ajax в другой функции

Question

Я хочу использовать модальный, поэтому я получаю значение данных от ajax. данные подобны этому [{'source_name': '인터넷', 'description': '여행 자료', 'source_slug': '_1', 'subject_name': '여행', 'subject_slug': '_6'}]

Я хочу поместить значение source_name "인터넷" в переменную source_name. Я хочу использовать переменную soure_name в этой строке.

html += '<li><span> 출처 : <a href="/tag/' + source_slug + '">' + source_name + '</a>' 

, но source_name не определено. , пожалуйста, помогите мне

это код.

function showModal(){ 

      var pk = $(this).find('img').attr('id'); 
      $.ajax({ 
      url : '/photo/' + pk + '/', 
      async: false, 
      success: function(data){ 
       data= JSON.stringify(data) 
       var source_slug = data[0]["source_slug"]; 
       var source_name = data[0]["source_name"]; 
       var description = data[0]["description"]; 
       var subject_slug = data[0]["subject_slug"]; 
       var subject_name = data[0]["subject_name"]; 
       } 
      }); 
var src = $(this).find('img').attr('src'); 
      var largeImg = $(this).find('img').attr('data-bsp-large-src'); 
      if(typeof largeImg === 'string'){ 
       src = largeImg; 
      } 
      var index = $(this).attr('data-bsp-li-index'); 
      var ulIndex = $(this).parent('ul').attr('data-bsp-ul-index'); 
      var ulId = $(this).parent('ul').attr('data-bsp-ul-id'); 
      var theImg = $(this).find('img'); 
      var pText = $(this).find('.text').html();   
      var modalText = typeof pText !== 'undefined' ? pText : 'undefined'; 
      var alt = typeof theImg.attr('alt') == 'string' ? theImg.attr('alt') : null; 

      clicked.img = src; 
      clicked.prevImg = parseInt(index) - parseInt(1); 
      clicked.nextImg = parseInt(index) + parseInt(1); 
      clicked.ulIndex = ulIndex; 
      clicked.ulId = ulId; 


      $('#bsPhotoGalleryModal').modal(); 

      var html = ''; 
      var img = '<img src="' + clicked.img + '" class="img-responsive"/>'; 

      html += img; 
      html += '<span class="' + settings.iconClose + ' bsp-close"></span>'; 
      html += '<div class="bsp-text-container">'; 
      html += '<li><span> 출처 : <a href="/tag/' + source_slug + '">' + source_name + '</a>' 
      html += '</span></li>' 
      html += '<li><span> 과목 및 단원 :<a href="/tag/' + subject_slug + '">' + subject_name + '</a>' 
      html += '<li><span>' + description + '</span></li>' 
      html += '</div>'; 
      html += '<a class="bsp-controls next" data-bsp-id="'+clicked.ulId+'" href="'+ (clicked.nextImg) + '"><span class="' + settings.iconRight + '"></span></a>'; 
      html += '<a class="bsp-controls previous" data-bsp-id="'+clicked.ulId+'" href="' + (clicked.prevImg) + '"><span class="' + settings.iconLeft + '"></span></a>'; 

      $('#bsPhotoGalleryModal .modal-body').html(html); 
      $('.bsp-close').on('click', closeModal); 
      showHideControls(); 
     } 

Answer 1

Вам необходимо внести изменения внутри успеха не после того, как:

function showModal(){ 

    var pk = $(this).find('img').attr('id'); 
    $.ajax({ 
    url : '/photo/' + pk + '/', 
    async: false, 
    success: function(data){ 
     data= JSON.stringify(data) 
     var source_slug = data[0]["source_slug"]; 
     var source_name = data[0]["source_name"]; 
     var description = data[0]["description"]; 
     var subject_slug = data[0]["subject_slug"]; 
     var subject_name = data[0]["subject_name"]; 
     var src = $(this).find('img').attr('src'); 
     var largeImg = $(this).find('img').attr('data-bsp-large-src'); 
     if(typeof largeImg === 'string'){ 
      src = largeImg; 
     } 
     var index = $(this).attr('data-bsp-li-index'); 
     var ulIndex = $(this).parent('ul').attr('data-bsp-ul-index'); 
     var ulId = $(this).parent('ul').attr('data-bsp-ul-id'); 
     var theImg = $(this).find('img'); 
     var pText = $(this).find('.text').html();   
     var modalText = typeof pText !== 'undefined' ? pText : 'undefined'; 
     var alt = typeof theImg.attr('alt') == 'string' ? theImg.attr('alt') : null; 

     clicked.img = src; 
     clicked.prevImg = parseInt(index) - parseInt(1); 
     clicked.nextImg = parseInt(index) + parseInt(1); 
     clicked.ulIndex = ulIndex; 
     clicked.ulId = ulId; 


     $('#bsPhotoGalleryModal').modal(); 

     var html = ''; 
     var img = '<img src="' + clicked.img + '" class="img-responsive"/>'; 

     html += img; 
     html += '<span class="' + settings.iconClose + ' bsp-close"></span>'; 
     html += '<div class="bsp-text-container">'; 
     html += '<li><span> 출처 : <a href="/tag/' + source_slug + '">' + source_name + '</a>' 
     html += '</span></li>' 
     html += '<li><span> 과목 및 단원 :<a href="/tag/' + subject_slug + '">' + subject_name + '</a>' 
     html += '<li><span>' + description + '</span></li>' 
     html += '</div>'; 
     html += '<a class="bsp-controls next" data-bsp-id="'+clicked.ulId+'" href="'+ (clicked.nextImg) + '"><span class="' + settings.iconRight + '"></span></a>'; 
     html += '<a class="bsp-controls previous" data-bsp-id="'+clicked.ulId+'" href="' + (clicked.prevImg) + '"><span class="' + settings.iconLeft + '"></span></a>'; 

     $('#bsPhotoGalleryModal .modal-body').html(html); 
     $('.bsp-close').on('click', closeModal); 
     showHideControls(); 
    } 
     });}