在阵列中华丽地传递

magnific passing in array

本文关键字：阵列      更新时间：2023-09-26

我正在尝试传入图像列表以获得华丽的弹出窗口以使用这些图像，但是如果我将它们作为变量传入，则不起作用。我可以控制台.log变量的输出并将其粘贴到宏伟调用中的变量位置，它工作得很好。知道为什么在这里传递变量不起作用吗？

在这里您可以对其进行编辑，但您必须在此处查看它才能对其进行测试。

同样，您可以复制控制台的输出.log并将其粘贴到变量 compiledList 的位置，它只是不能作为变量工作。

下面是代码... 

$(function(){
var urlList = ["http://img3.wikia.nocookie.net/__cb20140125162709/cartoonfatness/images/c/c0/Futurama.jpg","http://img3.wikia.nocookie.net/__cb20140125162709/cartoonfatness/images/c/c0/Futurama.jpg","http://img3.wikia.nocookie.net/__cb20140125162709/cartoonfatness/images/c/c0/Futurama.jpg"];

var compiledList = ( '{src : ''' + urlList.join('''}, {src : ''') + '''}' );

$('a').on('click',function(e){
e.preventDefault();
$.magnificPopup.open({
items: [compiledList],
gallery: {
  enabled: true
},
type: 'image',
callbacks: {
  open: function() {
  console.log(compiledList);
  }
}
});
});
});

你目前正在做的是制作一个字符串，当console.log ed看起来像一个对象时，它不是。这里有2个简单的选择。

  1. 只需通过用{src: "URL"}包装每个 url 来使urlList对象数组
  2. 使用for loop循环访问urlList并创建对象数组。我在下面添加了此代码。

http://jsbin.com/sokidazi/2

var urlList = ["http://img3.wikia.nocookie.net/__cb20140125162709/cartoonfatness/images/c/c0/Futurama.jpg","http://img3.wikia.nocookie.net/__cb20140125162709/cartoonfatness/images/c/c0/Futurama.jpg","http://img3.wikia.nocookie.net/__cb20140125162709/cartoonfatness/images/c/c0/Futurama.jpg"],
    i = 0,
    l = urlList.length,
    compiledList = [];
for(;i < l;i++){
  compiledList.push({src: urlList[i]});
}

$('a').on('click',function(e){
  e.preventDefault();
  $.magnificPopup.open({
  items: compiledList,
    gallery: {
      enabled: true
    },
    type: 'image',
    callbacks: {
      open: function() {
      console.log(compiledList);
      }
    }
  });
});
相关文章：