2017-01-01 10 views
0

$(document).ready(function() { 
 

 
    // page is now ready, initialize the calendar... 
 

 
    $('#calendar').fullCalendar({ 
 
     // put your options and callbacks here 
 
     left: 'Calendar', 
 
     center: '', 
 
     right: 'today prev,next' 
 
    }) 
 

 
});
<html> 
 
    <head> 
 
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script> 
 
<script src='/js/fullcalendar/lib/moment.min.js'></script> 
 
<script src='http://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.js'></script> 
 
<link rel='stylesheet' href='/js/fullcalendar/fullcalendar.css' /> 
 
    </head> 
 
    <body> 
 
    <div id='calendar'></div> 
 
    </body> 
 

 
    </html>

Я пытаюсь добавить календарь с моим шаблоном лезвия, и я в конечном итоге с этой ошибкой.

app.js:3 Uncaught TypeError: $(...).fullCalendar is not a function(…)

голова моя секция выглядит следующим образом

<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script> 
<script src='/js/fullcalendar/lib/moment.min.js'></script> 
<script src='http://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.js'></script> 
<link rel='stylesheet' href='/js/fullcalendar/fullcalendar.css' /> 

и чем после того, как я зову fullCalender на готовом событии

<script> 
$(document).ready(function() { 

    // page is now ready, initialize the calendar... 

    $('#calendar').fullCalendar({ 
     // put your options and callbacks here 
    }) 

}); 
</script> 

С CDN Я пытаюсь принести последнюю Jquery и FullCalendar.

С моим фрагментом я добавил /lib/moment.min.js Я подтверждаю, что этот файл загружается отлично с моей локальной машины.

+1

Поместите свои скрипты в нижней части своего html вместо заголовка –

+0

@SamarRizvi Я уже пробовал. пока не повезло. – vsoni

+0

Можете ли вы поставить скрипку, чтобы проверить –

ответ

1

Включите ваш сценарий после включения вашей JQuery библиотеки

<html> 
 
     <head> 
 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
     <script src="https://momentjs.com/downloads/moment.min.js"></script> 
 
     <script src='https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.js'></script> 
 
     <link rel='stylesheet' href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.min.css" /> 
 
     </head> 
 
     <body> 
 
     <div id='calendar'></div> 
 

 
     <script> 
 
      $(document).ready(function() { 
 

 
      // page is now ready, initialize the calendar... 
 

 
      $('#calendar').fullCalendar({ 
 
       // put your options and callbacks here 
 
       left: 'Calendar', 
 
       center: '', 
 
       right: 'today prev,next' 
 
       }); 
 

 
      }); 
 
     </script> 
 
     </body> 
 
     </html>

1

Где ваш JQuery UI и вы должны запускать скрипты в нижней части и CSS в верхней части.

Codepen Демонстрационный http://codepen.io/norcaljohnny/pen/OWLjaX

<head> 
<link rel='stylesheet' href='https://fullcalendar.io/js/fullcalendar-3.1.0/fullcalendar.min.css' /> 
</head> 

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

<script src='https://fullcalendar.io/js/fullcalendar-3.1.0/lib/moment.min.js'></script> 
<script src='https://fullcalendar.io/js/fullcalendar-3.1.0/lib/jquery.min.js'></script> 
<script src='https://fullcalendar.io/js/fullcalendar-3.1.0/lib/jquery-ui.min.js'></script> 
<script src='https://fullcalendar.io/js/fullcalendar-3.1.0/fullcalendar.min.js'></script> 
</body> 

Это источник образца от разработчика.

> <meta charset='utf-8' /> <link href='../fullcalendar.min.css' 
> rel='stylesheet' /> <link href='../fullcalendar.print.min.css' 
> rel='stylesheet' media='print' /> <script 
> src='../lib/moment.min.js'></script> <script 
> src='../lib/jquery.min.js'></script> <script 
> src='../lib/jquery-ui.min.js'></script> <script 
> src='../fullcalendar.min.js'></script> <script> 
0

Я ценю все за ваше время, чтобы помочь мне здесь. Я обнаружил, что у меня есть другой файл .js, расположенный внизу страницы, что вызывает эту проблему. Я прокомментировал, что .js и я получили календарь на моем шаблоне клинка. Спасибо всем.