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内容

回答

相关问题