Jquery plugins 配置设置中的jquery插件传递变量

我想在我的插件默认配置设置中传递一个数组。我试图给用户一个选项，让他们可以添加任意数量的title和src变量，例如：

desktop_xl: {
   "title":"beach",
   "src":"http://images.smh.com.au/2013/02/25/4061249/art-Whitehaven-Beach-620x349.jpg" 
            },
        {
        "title":"sunset",
        "src":"https://lh5.googleusercontent.com/-Oh0HlfM31BQ/TlXHejUNpeI/AAAAAAAABiI/tQbJJEGEOnU/s400/red_sunset_beach.jpg"
        }

我在堆栈溢出上看到过这个问题，但找不到适合我的答案。 我读了一些书，发现我可以创建一个对象数组，它只能在我的index.html页面上正常工作，如下所示：

问题是我想在我的插件中使用这个数组作为配置选项，这样用户就可以根据需要添加尽可能多的title和src变量，但是这个数组在插件中不起作用

当我做了

console.log（desktop_xl）时

在my index.html页面上，它显示为一个对象

我阅读了文档，据我所知，我需要合并我的对象以将它们作为配置选项传递，这里是从我的drop box帐户到我的插件的链接（由于某些原因，js fiddle没有使用https链接），请参阅下面到jquery.myplugin.js的链接（目前为随机名称，但在我计算出逻辑后将使用唯一的命名约定）：

有谁能帮我弄清楚如何在我的配置选项中传递这个变量，这样用户就可以从选项桌面添加尽可能多的“title”和“src”

更新：

我已经知道了如何提取数组信息并将其附加到我的图像中，但是，我仍然不知道如何将其“链接”到插件选项设置，因为我需要为用户提供选项，以便在选项设置中添加尽可能多的带有标题的图像。 下面是我如何从阵列中提取数据的方法：

 //create img desktop_xl loop    
    $.each(desktop_xl, function( index , value ){

        $('#container').append( 

                        $("<img />").attr({ 
                                    id: value.title, 
                                    src: value.src,
                                    title: value.title

                        })


         );


     });

//创建img桌面\u xl循环
$。每个（桌面、功能（索引、值）{
$（“#容器”）。附加（
$("
更新2:

我对插件做了更多的工作，下面是到目前为止的代码：

;(function($, window, document, undefined){

//define MyjQueryPlugin object with default config settings:

 $.MyjQueryPlugin = {
 defaults: {
            imagecontainer: "#container",
            version: "v01"

// add my Arrays to default options here?
// arrays should allow users to add as many images to #container div as they require
// arrays are desktop_xl[] , desktop_l[] , ipad_p[] , mobile_l[], mobile_p[]  
 }
 };


//extend jquery with the plugin
$.fn.extend({
    MyjQueryPlugin:function(config) {

    //use defaults or properties supplied by user
    var config = $.extend({}, $.MyjQueryPlugin.defaults, config );

//append slides         
$(config.imagecontainer).append('<div class="imagecontainerfordesktop_xlarray" </div>').css('height', $(window).height() );

// append MyjQueryPlugin sidebar
    this.append( '<div id="Mysidebar" class="open">' +
        '<p class="review">Version ' + config.version  + '- ready for review</p>'+
        '<hr>' +
        '</div>')
        .children()
        .css('height', $(window).height() );



//create array of objects        
var desktop_xl = [
    {
    "title":"Homepage", // text for sidebar
    "src":"slides/1200/Homepage.jpg"// path to image >= 1200px wide
    },
       {
    "title":"Categories", // text for sidebar
    "src":"slides/1200/Categories.jpg"// path to image >= 1200px wide
    },
    {
    "title":"Product description", // text for sidebar
    "src":"slides/1200/Product_description.jpg" // path to image >= 1200px wide
    }
];

var desktop_l = [
    // if array is empty, remove elements from the page
];

var ipad_p = [
    {
    "title":"Homepage", // text for sidebar
    "src":"slides/480/Homepage.jpg" // path to image >= 480px wide
    }
]; 
var mobile_l = [];        
var mobile_p = [];

// set Global Variables
var width           =   $(window).width();
var currHeight      =   $(window).height();
var ctrl            =   $(".ctrl");
var ulscreenlia     =   $('ul.screen li a');
var sidebarlia      =   $('#MyjQueryPluginsidebar li a');
var sidebar         =   $("#MyjQueryPluginsidebar");
var ulscreenli      =   $('ul.screen li');

if (desktop_xl.length === 0) {
  ulscreenli.eq(0).hide();
$('div.select_join option[value="xld"]').remove();    
}
if (desktop_l.length === 0) {
  ulscreenli.eq(1).hide();
$('div.select_join option[value="ld"]').remove(); 
}
if (ipad_p.length === 0) {
  ulscreenli.eq(2).hide();
$('div.select_join option[value="ip"]').remove(); 
}
if (mobile_l.length === 0) {
  ulscreenli.eq(3).hide();
$('div.select_join option[value="ml"]').remove(); 
}        
if (mobile_p.length === 0) {
  ulscreenli.eq(4).hide();
$('div.select_join option[value="mp"]').remove(); 
}

    //create img desktop_xl loop    
    $.each(desktop_xl, function( index , value ){

        $('#container .slides-xld').append( 
            //getting values from array but cannot understand how to pass array(s): desktop_xl, desktop_l, ipad_p, mobile_l, mobile_p  inside config option
             //And Each arrays should allow user to add multiple images to #container dive
                        $("<img />").attr({ 
                                    id: value.title, 
                                    src: value.src,
                                    title: value.title
                        })


         );
     });

       //create img ipadp loop    
    $.each(ipad_p, function( index , value){

        $('#container .slides-ipadp').append( 

                        $("<img />").attr({ 
                                    id: value.title, 
                                    src: value.src,
                                    title: value.title
                                })
         );
     });


function rundateobject(){

            var current_date = new Date ( );

            var month_names = new Array ( );
            month_names[month_names.length] = "January";
            month_names[month_names.length] = "February";
            month_names[month_names.length] = "March";
            month_names[month_names.length] = "April";
            month_names[month_names.length] = "May";
            month_names[month_names.length] = "June";
            month_names[month_names.length] = "July";
            month_names[month_names.length] = "August";
            month_names[month_names.length] = "September";
            month_names[month_names.length] = "October";
            month_names[month_names.length] = "November";
            month_names[month_names.length] = "December";

            var day_names = new Array ( );
            day_names[day_names.length] = "Sunday";
            day_names[day_names.length] = "Monday";
            day_names[day_names.length] = "Tuesday";
            day_names[day_names.length] = "Wednesday";
            day_names[day_names.length] = "Thursday";
            day_names[day_names.length] = "Friday";
            day_names[day_names.length] = "Saturday";

            $('#date').html( day_names[current_date.getDay()] 
            + ', ' 
            + month_names[current_date.getMonth()] 
            + ' ' 
            + current_date.getDate() 
            + ' ' 
            + current_date.getFullYear() );

};

//create animation for anchor links with jQuery DOM ready function        
$(function(){     
    $('a').hover(function(){
          $(this).animate({
             'margin-left':10,
             'padding-left':20

          },200); 
        $(this).dequeue(); 
        },
        function() {
          $(this).animate({
             'margin-left':0,
             'padding-left':15
          },200);
            $(this).dequeue(); 
        }        
      );
}); 

//on resize browser, adjust elements height


//initialise plugins 
$(".nano").nanoScroller();   

//initialise functions
rundateobject(); 

//return the jquery object for chaining
return this;

  }// config options  

}); // jQuery extend


})(jQuery, window, document);

；（函数（$，窗口，文档，未定义）{
//使用默认配置设置定义MyjQueryPlugin对象：
$.MyjQueryPlugin={
默认值：{
imagecontainer:“容器”，
版本：“v01”
//是否将我的阵列添加到此处的默认选项？
//数组应允许用户根据需要向#container div添加尽可能多的图像
//阵列包括桌面xl[]、桌面l[]、ipad p[]、移动l[]、移动p[]
}
};
//使用插件扩展jquery
$.fn.extend({
MyjQueryPlugin:函数（配置）{
//使用用户提供的默认值或属性
var config=$.extend（{}，$.MyjQueryPlugin.defaults，config）；
//附加幻灯片
$（config.imagecontainer）.append（“答案是由用户kbwood.au在jquery.com上给我的

defaults: {
            imagecontainer: "#container",
            version: "v01",
            desktop_xl: [] //Array

 }

然后在.each函数中，我们需要将数组作为config.desktop\u xl传递：

//create img desktop_xl loop    
    $.each(config.desktop_xl, function( index , value ){

        $('#container').append( 

                        $("<img />").attr({ 
                                    id: value.title, 
                                    src: value.src,
                                    title: value.title

                        })


         );


     });

//创建img桌面\u xl循环
$.each（config.desktop_xl，函数（索引，值）{
$（“#容器”）。附加（
$("