Question

我对JavaScript和jQuery很陌生，所以如果这是一个简单的问题，请与我联系。我尝试了搜索功能以及Google中的几个JavaScript网站，但我似乎无法得到解决我的问题的答案（我明白了;-)）

我想构建一个日历，显示存储在数据库中的事件。为此，我在脚本开头循环一组记录，并在变量vEvents中构建一个最终包含此字符串的字符串：

{ 
   title: 'new appointment', 
   start: '12-OCT-2011 14:00' 
}, 
{ 
   title: 'next appointment', 
   start: '12-OCT-2011 15:00' 
}

等等。因此，每个事件都是由驻留在数据库中的信息构建的，事件条目的最终数量（在两个大括号之间）是未知的，并且可以针对日历的每次调用动态地更改。

我正在使用jQuery日历插件（http://arshaw.com/fullcalendar），它使用jQuery调用构建日历：

$('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay',
            },
            editable: false,
            height: 370,
            firstDay: 1,
            weekMode: 'liquid',
            minTime: 8,
            maxTime: 22,
            weekends: false,
            //and now on to the event creation
            events: [
                {
                 title: 'this is a standard event',
                 start: '11-OCT-2011 16:00'
                },
                {
                 title: ' yet another demonstration event',
                 start: '11-OCT-2011 17:00'
                }]
});

我想要做的是用之前构建的变量的内容替换该调用中的前卫括号[]之间的任何东西，所以像

这样的东西

//and now on to the event creation
events: [
   $(vEvents) // or some other unknown syntax, or an evaluation function etc. that
              // replaces the varibale with it's content at that place
]

我无法完成替换，我尝试了eval()函数和其他一些方法但是jQuery总是抱怨语法不正确。那么总体上可以做到这一点，如果是积极的，我该怎么做？如果有人能给我正确的语法，我将非常感激！

非常感谢

的Stefan

Answer 1

好像fullCalendar插件需要一个对象数组。所以如果vEvents看起来像这样：

var vEvents = [//this bracket starts an array
    {//this bracket starts an object
        title: 'new appointment',//this line defines the `title` property of the object it's in
        start: '12-OCT-2011 14:00'//this line defines the `start` property of the object it's in
    },//this ends the current object and the comma separates the two objects as items in an array
    { 
        title: 'next appointment', 
        start: '12-OCT-2011 15:00' 
    }
    //note that there is not a comma here, it's important that commas are only between objects and there is no trailing comma at the end of the list of objects
];//this bracket ends the array

然后你应该能够events选项设置为vEvents变量，如下所示：

$('#calendar').fullCalendar({
    ...
    //and now on to the event creation
    events: vEvents
});

<强> - UPDATE -

//first, create an empty array
var myEvents = [];

//then iterate through your data
for (var rowIx = 0; rowIx < this.Data.Rows.length; rowIx++) {

    //and add an object, notice the `{` and `}` (brackets) that note the beginning and ending of an object definition
    myEvents.push({title : this.Data.Rows[rowIx][2].text, start : this.Data.Rows[rowIx][5].text;);
}

.push()在数组的末尾添加一个值，所以我们在这里.push()将一个对象放到数组中。 title : this.Data.Rows[rowIx][2].text将title属性添加到新对象，并将您想要的值映射到该属性。

Answer 2

这是您之前构建的变量。它是一个数组，用方括号表示。

var myEvents = [
            {
             title: 'this is a standard event',
             start: '11-OCT-2011 16:00'
            },
            {
             title: ' yet another demonstration event',
             start: '11-OCT-2011 17:00'
            }];

这是您的日历设置。

$('#calendar').fullCalendar({
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay',
        },
        editable: false,
        height: 370,
        firstDay: 1,
        weekMode: 'liquid',
        minTime: 8,
        maxTime: 22,
        weekends: false,
        events: myEvents
});

Answer 3

为此，我在脚本开头循环一组记录，并在变量vEvents中构建一个字符串

您可以构建一个JavaScript对象，而不是构建字符串吗？

如果没有，请生成有效的JSON格式化字符串，然后使用jQuery.parseJSON()从中获取JavaScript对象。

请记住vEvents应该是一个对象数组。

然后使用

$('#calendar').fullCalendar({
    events: vEvents
});

Answer 4

您需要一个简单的变量。所以要先测试一下

var vEvents = [
                {
                 title: 'this is a standard event',
                 start: '11-OCT-2011 16:00'
                },
                {
                 title: ' yet another demonstration event',
                 start: '11-OCT-2011 17:00'
                }
              ];

// Calendar code
  ...
  maxTime: 22,
  weekends: false,
  //and now on to the event creation
  events: vEvents });

一旦你知道它有效，你就可以用你从数据库中读取的数据动态填充vEvents数组，只需将它添加到数组中即可。

如何将变量的内容传递给jquery函数？

4 个答案: