Fancybox 2動態json內容

我試圖添加一些動態內容到Fancybox 2.0彈出窗口，當有人點擊一個按鈕。我嘗試了幾件事，但我無法得到這個工作。我總是收到「請求的內容無法加載」。錯誤。Fancybox 2動態json內容

我首先要單擊按鈕時加載JSON內容，然後打開與內容彈出...

修訂的問題，因爲它是重複

我有什麼：

HTML

<a href="#quick_cart" class="opener cart" id="productid_1234" data-fancybox-href=" url-to-product">Add to cart</a>

jQuery的

$(document).ready(function() { 

      $('.opener').click(function(e){ 
      e.preventDefault(); 

      var url = $(this).data('fancybox-href') + '/?format=json'; 
      console.log(url); 

      $.fancybox({ 
       type: 'inline', 
       beforeLoad: function(){ 
       quick_cart(url); 
       } 
      }); 
      }); 
     }); 
     function quick_cart(url){ 

      $.getJSON(url, function (data){ 

      $('#quick_cart').append('<div>' + data.product.title + '</div>'); 

      });  
     }

該腳本爲json內容加載正確的url並填充隱藏的div #quick_cart。然而，問題是我收到錯誤「請求的內容無法加載」。我不明白爲什麼......

難道是「type：inline」不對嗎？我嘗試了幾件事，甚至刪除了這條線，但沒有運氣。當我刪除該行時，彈出窗口不顯示。

我做錯了什麼？任何幫助不勝感激。

來源

2013-12-19 Meules

有問題的列表。將從一些開始。 1）。在'var url = $（this）.attr（「href」）+'/？format = json';'中，'$（this）'應該引用一個選擇器，因爲在這一點上是'undefined'。 2）。缺少顯示要從中獲取'href'屬性的元素的html，如數字[1] 3）。 '$（this）.fancybox（）'只綁定fancybox到'$（this）'，但它不會觸發它。您可以改爲使用'$ .fancybox（）'。 4）。在你的API選項結尾處有一個額外的尾隨逗號**和**在你的代碼中有一個額外的鬆散的關閉'}'大括號（你會看到一個語法錯誤） – JFK

@JFK：好的，謝謝你的支持！但總體而言，「設置」是正確的做法嗎？ – Meules

仍然看不到從哪裏得到$（this）.attr（「href」）+'/？format = json'中的'href'值？ – JFK

確實把我所有的頭髮都拉出來了。因此，在這裏幫助別人解決方案：

代碼不知道將函數quick_cart中生成的HTML放在哪裏。因此，對fancybox代碼的簡單href屬性就足夠了。像這樣：

$.fancybox({ 
    type: 'inline', 
    beforeLoad: function(){ 
    quick_cart(url); 
    }, 
    href: 'quick_cart' 
});

希望這可以幫助別人;）

來源

2013-12-30 15:15:31 Meules

Fancybox 2動態json內容

回答

相關問題