memory_leak.html 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset='utf-8' />
  5. <link href='../../dist/fullcalendar.css' rel='stylesheet' />
  6. <link href='../../dist/fullcalendar.print.css' rel='stylesheet' media='print' />
  7. <script src='../../node_modules/moment/moment.js'></script>
  8. <script src='../../node_modules/jquery/dist/jquery.js'></script>
  9. <script src='../../dist/fullcalendar.js'></script>
  10. <script>
  11. $(document).ready(function() {
  12. var count = 0;
  13. var intervalID;
  14. $('#start').on('click', start);
  15. $('#stop').on('click', stop);
  16. function start() {
  17. initCalendar();
  18. intervalID = setInterval(function() {
  19. destroyCalendar();
  20. initCalendar();
  21. if (count > 100) {
  22. stop();
  23. }
  24. count++;
  25. }, 200);
  26. }
  27. function stop() {
  28. if (intervalID) {
  29. clearInterval(intervalID);
  30. intervalID = null;
  31. }
  32. destroyCalendar();
  33. }
  34. function initCalendar() {
  35. $('#calendar').fullCalendar({
  36. headerToolbar: {
  37. left: 'prev,next today',
  38. center: 'title',
  39. right: 'month,week,day'
  40. },
  41. initialDate: '2014-06-12',
  42. initialView: 'dayGridMonth', // week
  43. editable: true,
  44. selectable: true,
  45. droppable: true,
  46. events: [
  47. {
  48. title: 'All Day Event',
  49. start: '2014-06-01'
  50. },
  51. {
  52. title: 'Long Event',
  53. start: '2014-06-07',
  54. end: '2014-06-10'
  55. },
  56. {
  57. groupId: 999,
  58. title: 'Repeating Event',
  59. start: '2014-06-09T16:00:00'
  60. },
  61. {
  62. groupId: 999,
  63. title: 'Repeating Event',
  64. start: '2014-06-16T16:00:00'
  65. },
  66. {
  67. title: 'Meeting',
  68. start: '2014-06-12T10:30:00',
  69. end: '2014-06-12T12:30:00'
  70. },
  71. {
  72. title: 'Lunch',
  73. start: '2014-06-12T12:00:00'
  74. },
  75. {
  76. title: 'Birthday Party',
  77. start: '2014-06-13T07:00:00'
  78. },
  79. {
  80. title: 'Click for Google',
  81. url: 'http://google.com/',
  82. start: '2014-06-28'
  83. }
  84. ]
  85. });
  86. }
  87. function destroyCalendar() {
  88. $('#calendar').fullCalendar('destroy');
  89. }
  90. });
  91. </script>
  92. <style>
  93. body {
  94. margin: 0;
  95. padding: 0;
  96. font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
  97. font-size: 14px;
  98. }
  99. #calendar {
  100. width: 900px;
  101. margin: 40px auto;
  102. }
  103. </style>
  104. </head>
  105. <body>
  106. <button id='start'>START</button>
  107. <button id='stop'>STOP</button>
  108. <div id='calendar'></div>
  109. </body>
  110. </html>