0

只是似乎无法让这种情况发生！

$(".fancy").click(function(event) {
  event.preventDefault();
  var pic = [];
  $('.room-thumbnail').each(function(index) {
      pic.push('\'' + 'http://localhost' + $(this).attr('href') + '\'' );
  });

  var pics = '['+ pic.join(', ')+']';

  console.log(pics);
  // => ['http://localhost/driver/images/produits/denim/sixthjune-7440/sixthjune-7440.jpg', 'http://localhost/driver/images/produits/denim/sixthjune-7440/sixthjune-7440-back.jpg', 'http://localhost/driver/images/produits/denim/sixthjune-7440/sixthjune-7440-closeup1.jpg', 'http://localhost/driver/images/produits/denim/sixthjune-7440/sixthjune-7440-closeup2.jpg']

  $.fancybox(pics, {
          'transitionIn'      : 'elastic',
          'transitionOut'     : 'elastic',
          'overlayColor'      : '#1D1D1D',
          'type'              : 'image',
          'cyclic': true
      });
});

如果我手动输入 href 网址（图片），它可以工作。但是当我通过 fancybox 变量（图片）我得到了 fancybox 错误： - 无法加载请求的内容。- 请稍后再试。-

有人可以告诉我我做错了什么吗？

提前致谢。

4

2 回答 2

1

您的代码没有任何问题，但您没有考虑到一些问题：

您的声明var pics = '['+ pic.join(', ')+']';返回了一个fancybox 无法解析的字符串。

你需要做的就是把这样的字符串转换成 javascript object，这样 fancybox 就可以解析它了。有不同的方法可以做到这一点。一种是使用该eval()功能，但可能存在安全问题，因此不推荐使用此方法。

由于您使用的是 jQuery，因此最安全的方法是使用jQuery.parseJSON( json )

...所以就在您设置变量的那一行之后pics

var pics = '['+ pic.join(', ')+']';

添加此以将其转换为 js 对象

pics = jQuery.parseJSON(pics);

这应该够了吧。

于 2012-04-20T05:04:23.607 回答
0

你可以这样做：

  1. 创建一个显示属性设置为无的容器 div (display:none)
  2. 在这个容器内放置 de img 标签
  3. 当您在 div 内的任何图像上调用函数触发单击事件时

例子：

<div>
 <img ...></img ...></img ...>
</div>

在 js 代码上： $("#container img").fancybox();

function call_fancybox(){
$("#container img:first").trigger("click");
}
于 2012-04-19T21:40:07.457 回答