Js框架仅加载一次,并被其他请求多次重用

时间:2018-07-10 22:10:02

标签: javascript fullcalendar

我要在同一页面上放置多个完整日历。问题在于,对于每个日历(我的页面中有100个日历),日历js脚本每次都会重新加载(完整的calendar.js,moment.js,jquery.js),这对于加载速度非常不利。有没有办法对导航器或代码说:将第一次加载保存在内存中并重用,而不是重新加载新脚本。

这是我的代码的想法:

page1.php:

<tbody>
      <tr>
        <th  scope="row">Monday</th>
        <td >
          <div class="embed-responsive embed-responsive-1by1">
            <iframe class="embed-responsive-item" src="page2.php?cell=140?day=Monday">                  </iframe>
           </div>
        </td>

和我的page2.php:

<html>
<head>
  <meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
  <script src="js/basket.full.min.js"></script>
  <link href="css/bootstrap.min.css" rel="stylesheet" />
  <script src='fullcalendar-3.9.0/lib/jquery.min.js'></script>
  <script src="js/bootstrap.min.js"></script>
  <script src='fullcalendar-3.9.0/lib/moment.min.js'></script>
  <script src='fullcalendar-3.9.0/fullcalendar1.min.js'></script>
  <link href='fullcalendar-3.9.0/fullcalendar1.min.css' rel='stylesheet' />
  <link href='fullcalendar-3.9.0/fullcalendar.print.min.css' rel='stylesheet' media='print' />

<script>

  $(document).ready(function() {

    $('#calendar').fullCalendar({
      header:false,
      defaultView: 'agendaDay',
      aspectRatio: 1,
      slotEventOverlap:false,
      slotLabelFormat: 'H',
      defaultDate: <?php echo json_encode($result[$dayNumber]); ?>,
      allDaySlot:false,
      navLinks: false, // can click day/week names to navigate views
      editable: false,
      eventLimit: false, // allow "more" link when too many events
      eventRender:
        function(event, element) {
        element.find('.fc-title').append("<br/>" + event.activity);

      },
      views: {
        agendaDay: {
        minTime: "09:00:00",
        maxTime: "19:00:00",
      }},
      eventSources: [
        {
          url: 'event.php?cell=<?php echo json_encode($cell);?>', // use the `url` property
          textColor: 'black'
        }]
    });

  });

</script>

</head>
<body>
  <div id='calendar'></div>
</body>
</html>

0 个答案:

没有答案