2016-04-18 3 views
2

Im работает на веб-сайте, который имеет всплывающее окно для информации о продукте. Внутри всплывающего окна есть ссылка, которая открывает второе всплывающее окно для информации о доставке.Как заменить файл magnificPopup (ajax) на новый контент ajax

Мы хотим заменить всплывающее содержимое при нажатии второй ссылки.

Возможно ли это?

Это то, что я пытался до сих пор (не повезло) ..

// first popup 
$('.pop-ajax').magnificPopup({ 
     type: 'ajax', 
     closeBtnInside: true, // put close button on inside 

     callbacks: { 
      parseAjax: function(mfpResponse) { 
       mfpResponse.data = $(mfpResponse.data).find('.l-main'); 
      }, 
      ajaxContentAdded: function() { 
       // console.log('it works'); 
      } 
     } 
}); 

// Second popup (loads first popup when a link inside is clicked) 
$('.pop-product').magnificPopup({ 
    type: 'ajax', 
    closeBtnInside: true, // put close button on inside 

    callbacks: { 
     parseAjax: function(mfpResponse) { 
      mfpResponse.data = $(mfpResponse.data).find('#product-ajax'); 
     }, 
     ajaxContentAdded: function() { 
      console.log('First popup'); 
      // var mfp = $.magnificPopup.instance; 
      //  mfpContentContainer = mfp.contentContainer; 
      //  mfpContent = mfp.content; 


      $('.pop-ajax').click(function(){ 
       $('.pop-product').magnificPopup('close'); 
       $('.pop-ajax').magnificPopup({ 
        type: 'ajax', 
        closeBtnInside: true, // put close button on inside 

        callbacks: { 
         parseAjax: function(mfpResponse) { 
          mfpResponse.data = $(mfpResponse.data).find('.l-main'); 
         }, 
         ajaxContentAdded: function() { 
          // console.log('it works'); 
         } 
        } 
       }); 
      }); 
     } 
    } 
}); 

Второе всплывающее окно большое область содержимого на сайте. Одна из ссылок внутри этой области имеет ссылку на класс .pop-ajax. Однако мы не можем обновить или заменить всплывающее содержимое новым контентом.

Может ли кто-нибудь помочь пролить свет на то, что я делаю неправильно здесь?

ответ

0

Вы пытаетесь создать вложенные всплывающие окна, тогда согласно этой ссылке, это запрещено. Issues for Simultaneous Popups

Но если вы хотите открыть только одно всплывающее окно, в котором после щелчка по внутренней ссылке просто замените содержимое всплывающего окна. Затем обратитесь к следующей ссылке. Nested Popups

$('.first-popup-link, .second-popup-link').magnificPopup({ closeBtnInside:true}); 

В приведенном выше коде вы можете обнаружить, что для двух различных ссылок был создан тот же экземпляр magnificPopup.