javascript - 完整日历在事件标题显示结束时附加 'x'

Question

我试图在事件末尾显示一个“x”，以便当用户单击它时，它会从显示中删除该事件。

我使用以下代码来执行此操作:

eventRender: function(event, element) {
        element.append( "<span class='closeon'>X</span>" );
        element.find(".closeon").click(function() {
           $('#calendar').fullCalendar('removeEvents',event._id);
        });
    }

但是，“x”出现在下面的行中，如下所示:

...

如何才能将事件全部显示在一行上？

感谢您提前提供的帮助。

Answer 1

使用前置代替附加:

css:

.closeon { float: right; }

js:

eventRender: function(event, element) {
    var e = element.prepend("<span class='closeon'>&#10005;</span>");

    e.children('.closeon')
       .attr('data-event-id', event._id) 
       .click( function() {
          var id = $(this).attr('data-event-id');
          $('#calendar').fullCalendar('removeEvents',id);
       });            
}

[http://jsfiddle.net/8fa0j9d8/ ]