2017-06-04 52 views
0

作为FullCalendar的官方文档说明插入代码,但在运行页面时不显示日历。 imagenjquery中的错误不会显示FullCalendar

我认为错误可能是我附加在我的网上的脚本这些都是我的工作。

 <!-- calendar --> 
     <link href='temporal/fullcalendar.min.css' rel='stylesheet' /> 
     <link href='temporal/fullcalendar.print.min.css' rel='stylesheet' media='print' /> 
     <script src='temporal/moment.min.js'></script> 
     <script src='temporal/jquery.min.js'></script> 
     <script src='temporal/fullcalendar.min.js'></script> 


     <!-- CSS --> 
     <link rel="stylesheet" href="css/bootstrap.min.css"> 
     <link rel="stylesheet" href="css/style.css"> 
     <link rel="stylesheet" href="css/style-responsive.css"> 
     <link rel="stylesheet" href="css/animate.min.css"> 
     <link rel="stylesheet" href="css/vertical-rhythm.min.css"> 
     <link rel="stylesheet" href="css/owl.carousel.css"> 
     <link rel="stylesheet" href="css/magnific-popup.css">   
     <script type="text/javascript" src="js/push.min.js"></script> 

      <script> 

    $(document).ready(function() { 

     $('#calendar').fullCalendar({ 
      header: { 
       left: 'prev,next today', 
       center: 'title', 
       right: 'month,basicWeek,basicDay' 
      }, 
      defaultDate: '2017-05-12', 
      navLinks: true, // can click day/week names to navigate views 
      editable: true, 
      eventLimit: true, // allow "more" link when too many events 
      events: [ 
       { 
        title: 'All Day Event', 
        start: '2017-05-01' 
       }, 
       { 
        title: 'Long Event', 
        start: '2017-05-07', 
        end: '2017-05-10' 
       }, 
       { 
        id: 999, 
        title: 'Repeating Event', 
        start: '2017-05-09T16:00:00' 
       }, 
       { 
        id: 999, 
        title: 'Repeating Event', 
        start: '2017-05-16T16:00:00' 
       }, 
       { 
        title: 'Conference', 
        start: '2017-05-11', 
        end: '2017-05-13' 
       }, 
       { 
        title: 'Meeting', 
        start: '2017-05-12T10:30:00', 
        end: '2017-05-12T12:30:00' 
       }, 
       { 
        title: 'Lunch', 
        start: '2017-05-12T12:00:00' 
       }, 
       { 
        title: 'Meeting', 
        start: '2017-05-12T14:30:00' 
       }, 
       { 
        title: 'Happy Hour', 
        start: '2017-05-12T17:30:00' 
       }, 
       { 
        title: 'Dinner', 
        start: '2017-05-12T20:00:00' 
       }, 
       { 
        title: 'Birthday Party', 
        start: '2017-05-13T07:00:00' 
       }, 
       { 
        title: 'Click for Google', 
        url: 'http://google.com/', 
        start: '2017-05-28' 
       } 
      ] 
     }); 

    }); 

</script> 
      <style type="text/css"> 
      #calendar { 
     max-width: 900px; 
     margin: 0 auto; 
     font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif; 
     font-size: 14px; 

    } 
      </style> 

<div id="calendar"></div> 

     <!-- JS --> 
     <script type="text/javascript" src="js/jquery-1.11.2.min.js"></script> 
     <script type="text/javascript" src="js/jquery.easing.1.3.js"></script> 
     <script type="text/javascript" src="js/bootstrap.min.js"></script>   
     <script type="text/javascript" src="js/SmoothScroll.js"></script> 
     <script type="text/javascript" src="js/jquery.scrollTo.min.js"></script> 
     <script type="text/javascript" src="js/jquery.localScroll.min.js"></script> 
     <script type="text/javascript" src="js/jquery.viewport.mini.js"></script> 
     <script type="text/javascript" src="js/jquery.countTo.js"></script> 
     <script type="text/javascript" src="js/jquery.appear.js"></script> 
     <script type="text/javascript" src="js/jquery.sticky.js"></script> 
     <script type="text/javascript" src="js/jquery.parallax-1.1.3.js"></script> 
     <script type="text/javascript" src="js/jquery.fitvids.js"></script> 
     <script type="text/javascript" src="js/owl.carousel.min.js"></script> 
     <script type="text/javascript" src="js/isotope.pkgd.min.js"></script> 
     <script type="text/javascript" src="js/imagesloaded.pkgd.min.js"></script> 
     <script type="text/javascript" src="js/jquery.magnific-popup.min.js"></script> 
     <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAZsDkJFLS0b59q7cmW0EprwfcfUA8d9dg"></script> 
     <script type="text/javascript" src="js/gmap3.min.js"></script> 
     <script type="text/javascript" src="js/wow.min.js"></script> 
     <script type="text/javascript" src="js/masonry.pkgd.min.js"></script> 
     <script type="text/javascript" src="js/jquery.simple-text-rotator.min.js"></script> 
     <script type="text/javascript" src="js/all.js"></script> 
     <script type="text/javascript" src="js/contact-form.js"></script> 
     <script type="text/javascript" src="js/jquery.ajaxchimp.min.js"></script>   
+0

连接所有日历的js下面的'jQuery的1.11.2.min.js' – AdhershMNair

回答

0

修改代码这样

<!-- calendar --> 
    <link href='temporal/fullcalendar.min.css' rel='stylesheet' /> 
    <link href='temporal/fullcalendar.print.min.css' rel='stylesheet' media='print' /> 



    <!-- CSS --> 
    <link rel="stylesheet" href="css/bootstrap.min.css"> 
    <link rel="stylesheet" href="css/style.css"> 
    <link rel="stylesheet" href="css/style-responsive.css"> 
    <link rel="stylesheet" href="css/animate.min.css"> 
    <link rel="stylesheet" href="css/vertical-rhythm.min.css"> 
    <link rel="stylesheet" href="css/owl.carousel.css"> 
    <link rel="stylesheet" href="css/magnific-popup.css">   



     <style type="text/css"> 
     #calendar { 
    max-width: 900px; 
    margin: 0 auto; 
    font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif; 
    font-size: 14px; 

} 
     </style> 
<script type="text/javascript" src="js/jquery-1.11.2.min.js"></script> 
    <script type="text/javascript" src="js/jquery.easing.1.3.js"></script> 
    <script type="text/javascript" src="js/bootstrap.min.js"></script>   
    <script type="text/javascript" src="js/SmoothScroll.js"></script> 
    <script type="text/javascript" src="js/jquery.scrollTo.min.js"></script> 
    <script type="text/javascript" src="js/jquery.localScroll.min.js"></script> 
    <script type="text/javascript" src="js/jquery.viewport.mini.js"></script> 
    <script type="text/javascript" src="js/jquery.countTo.js"></script> 
    <script type="text/javascript" src="js/jquery.appear.js"></script> 
    <script type="text/javascript" src="js/jquery.sticky.js"></script> 
    <script type="text/javascript" src="js/jquery.parallax-1.1.3.js"></script> 
    <script type="text/javascript" src="js/jquery.fitvids.js"></script> 
    <script type="text/javascript" src="js/owl.carousel.min.js"></script> 
    <script type="text/javascript" src="js/isotope.pkgd.min.js"></script> 
    <script type="text/javascript" src="js/imagesloaded.pkgd.min.js"></script> 
    <script type="text/javascript" src="js/jquery.magnific-popup.min.js"></script> 
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAZsDkJFLS0b59q7cmW0EprwfcfUA8d9dg"></script> 
    <script type="text/javascript" src="js/gmap3.min.js"></script> 
    <script type="text/javascript" src="js/wow.min.js"></script> 
    <script type="text/javascript" src="js/masonry.pkgd.min.js"></script> 
    <script type="text/javascript" src="js/jquery.simple-text-rotator.min.js"></script> 
    <script type="text/javascript" src="js/all.js"></script> 
    <script type="text/javascript" src="js/contact-form.js"></script> 
    <script type="text/javascript" src="js/jquery.ajaxchimp.min.js"></script> 
    <script src='temporal/moment.min.js'></script> 
    <script src='temporal/fullcalendar.min.js'></script> 
    <script type="text/javascript" src="js/push.min.js"></script> 
<script> 

$(document).ready(function() { 

    $('#calendar').fullCalendar({ 
     header: { 
      left: 'prev,next today', 
      center: 'title', 
      right: 'month,basicWeek,basicDay' 
     }, 
     defaultDate: '2017-05-12', 
     navLinks: true, // can click day/week names to navigate views 
     editable: true, 
     eventLimit: true, // allow "more" link when too many events 
     events: [ 
      { 
       title: 'All Day Event', 
       start: '2017-05-01' 
      }, 
      { 
       title: 'Long Event', 
       start: '2017-05-07', 
       end: '2017-05-10' 
      }, 
      { 
       id: 999, 
       title: 'Repeating Event', 
       start: '2017-05-09T16:00:00' 
      }, 
      { 
       id: 999, 
       title: 'Repeating Event', 
       start: '2017-05-16T16:00:00' 
      }, 
      { 
       title: 'Conference', 
       start: '2017-05-11', 
       end: '2017-05-13' 
      }, 
      { 
       title: 'Meeting', 
       start: '2017-05-12T10:30:00', 
       end: '2017-05-12T12:30:00' 
      }, 
      { 
       title: 'Lunch', 
       start: '2017-05-12T12:00:00' 
      }, 
      { 
       title: 'Meeting', 
       start: '2017-05-12T14:30:00' 
      }, 
      { 
       title: 'Happy Hour', 
       start: '2017-05-12T17:30:00' 
      }, 
      { 
       title: 'Dinner', 
       start: '2017-05-12T20:00:00' 
      }, 
      { 
       title: 'Birthday Party', 
       start: '2017-05-13T07:00:00' 
      }, 
      { 
       title: 'Click for Google', 
       url: 'http://google.com/', 
       start: '2017-05-28' 
      } 
     ] 
    }); 

}); 

+0

呼叫的代码结束,我得到这些新的错误。 –

+0

调用这些网址首先是JS中的图片 – sphinx

+0

https://i.stack.imgur.com/GyDgF.jpg –