jQuery fullcalendar jquery插件的标题字符串中的HTML

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3410157/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 15:24:30  来源:igfitidea点击:

HTML in title string of fullcalendar jquery plugin

jqueryfullcalendar

提问by Chichi

I think the fullcalendar jquery-plugin is a really great solution. However, I noticed the plugin escapes (htmlEscape) the title. But I need to format some strings in the title, for example bold text, colors, or small images.

我认为 fullcalendar jquery-plugin 是一个非常好的解决方案。但是,我注意到插件会转义 (htmlEscape) 标题。但是我需要格式化标题中的一些字符串,例如粗体文本、颜色或小图像。

The solution with another plugin (for example qTip, like in the examples) will not work the right way for me. Is there anyway to format the title text?

使用另一个插件(例如 qTip,如示例中所示)的解决方案对我来说不起作用。无论如何格式化标题文本?

回答by Giancarlo Gomez

I did this instead as the other views use the same class but not spans and I forced in the title from the event rather than making an additional request for the text.

我这样做是因为其他视图使用相同的类而不是跨度,并且我从事件中强制输入标题,而不是对文本提出额外的请求。

eventRender: function (event, element) {
    element.find('.fc-event-title').html(event.title);
}


In v2, you may use:

在 v2 中,您可以使用:

element.find('span.fc-title').html(element.find('span.fc-title').text());

The span class is fc-titleas opposed to fc-event-title.

span 类fc-titlefc-event-title.

Credit to j00lzfor the comment confirming the change .

感谢j00lz的评论确认更改。

回答by Pascal Klein

Because the CSS class has changed, this is the correct answer:

因为 CSS 类发生了变化,这是正确的答案:

eventRender: function (event, element) {
    element.find('.fc-title').html(event.title);
}

回答by jhanifen

To easily have all html in event titles show I used this, makes it very easy.

为了轻松地显示事件标题中的所有 html,我使用了它,这非常容易。

eventRender: function (event, element) {
    element.find('span.fc-event-title').html(element.find('span.fc-event-title').text());           
}

Which was found here http://code.google.com/p/fullcalendar/issues/detail?id=152

这是在这里找到的http://code.google.com/p/fullcalendar/issues/detail?id=152

回答by Ashi

I have done like this, Check the link Link

我已经这样做了,检查链接 链接

eventRender: function (event, element) {
    element.find('.fc-title').html(event.title);/*For Month,Day and Week Views*/
    element.find('.fc-list-item-title').html(event.title);/*For List view*/
}

回答by seanhussey

I ended up doing something like this to put a link next to the time. Something similar should work for the title:

我最终做了这样的事情来在时间旁边放一个链接。类似的东西应该适用于标题:

    events: [
      <% @schedule.events.each do |event| %>
      {
        // Render your events here as needed
        // I added a custom attribute called eventDeleteLink, to be used below
      },
      <% end %>
    ],
    // Add this piece:
    eventRender: function(event, element) {
      element.find(".fc-event-time").append(" " + event.eventDeleteLink);
    }

So this uses jQuery's append() to add a space any a delete link after the time and it works fine for basic stuff.

因此,这使用 jQuery 的 append() 在时间之后添加任何删除链接的空格,它适用于基本内容。

What it didn't work for (and what I'd love to see a solution for, if anyone has one) is including code with nested quotes or double quotes. For instance, I was unable to add an onClick trigger because of the need (in my case) for single quotes within double quotes. I couldn't figure out how to escape them and not have (what I believe is) fullCalendar re-escaping them.

它不起作用的地方(以及我很想看到解决方案,如果有人有的话)是包含带有嵌套引号或双引号的代码。例如,由于需要(在我的情况下)双引号内的单引号,我无法添加 onClick 触发器。我不知道如何逃避它们并且没有(我认为是)fullCalendar 重新逃避它们。

Anyway, for basic text, this worked for me.

无论如何,对于基本文本,这对我有用。

回答by Sanil Shrestha

        eventRender: function (event, element) {
            element.find('.fc-title, .fc-list-item-title').html("<b>"+event.title+"</b>");
        },