#javascript #json #asp.net-mvc-3 #fullcalendar
#javascript #json #asp.net-mvc-3 #полный календарь
Вопрос:
Я пытаюсь включить полный календарь в программу запуска ASP.NET Веб-сайт MVC3 в качестве пробной версии, и я получаю сообщение об ошибке «Ошибка среды выполнения Microsoft JScript: объект не поддерживает это свойство или метод». Код, генерирующий веб-страницу, является
<!DOCTYPE html>
<html>
<head>
<link rel='stylesheet' type='text/css' href='~/Content/fullcalendar.css' />
<link rel='stylesheet' type='text/css' href='~/Content/fullcalendar.print.css' media='print' />
<script type='text/javascript' src='~/Scripts/fullcalendar.js'></script>
<script type='text/javascript' src='~/Scripts/gcal.js'></script>
<style type='text/css'>
body {
margin-top: 40px;
text-align: center;
font-size: 14px;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
}
#calendar {
width: 725px;
margin: 0 auto;
}
</style>
<title>Event Calendar</title>
<link href="../Content/Site.css" rel="stylesheet" type="text/css" />
<script src="/Scripts/jquery-1.4.4.js" type="text/javascript"></script>
</head>
<body>
<div class="page">
<div id="header">
<div id="title">
<h1>My MVC Application</h1>
</div>
<div id="logindisplay">
[ <a href="/Account/LogOn">Log On</a> ]
</div>
<div id="menucontainer">
<ul id="menu">
<li><a href="/Club/EventCalendar">Event Calendar</a></li>
<li><a href="/">Home</a></li>
<li><a href="/Home/About">About</a></li>
</ul>
</div>
</div>
<div id="main">
<div id="pageContent">
<script type="text/javascript">
$(document).ready(function () {
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay'
},
editable: true,
events: [
{
title: 'Lunch',
start: new Date(y, m, d, 12, 0),
end: new Date(y, m, d, 14, 0),
allDay: false
}
]
});
});
</script>
<div id="calendar">
</div>
</div>
<div id="linkContent" >
</div>
</div>
<div id="footer">
</div>
</div>
</body>
</html>
Происходит сбой при запуске кода javascript для создания календаря. Насколько я могу видеть, код такой, как показано на многих веб-сайтах. У кого-нибудь есть идеи, что может быть не так.
Ответ №1:
Вам необходимо импортировать jQuery перед подключаемым модулем. Поместите <script>
тег, который загружает jQuery, в начало <head>
.
Комментарии:
1. Я переместил все в
<Head>
раздел сайта. Мастер. Единственное, что находится на странице содержимого EventCalendar.aspx, — это<div id="calendar">
group, и при ее выполнении все еще происходит сбой$('#calendar').fullCalendar({....})
.2. Я повторю: вы должны поместить
<script>
тег, который импортирует jQuery, перед<script>
тегом, который импортирует плагин full calendar.3. Пожалуйста, прочитайте комментарии под ответом ppumpkins. Вы увидите, что я переместил все
<script>
cpmmands в<head>
раздел сайта. Главная страница.4. Пожалуйста, прочитайте комментарии под ответом ppumpkin. Вы увидите, что я переместил все
<script>
команды в<head>
раздел сайта. Главная страница. Ссылка на jquery-1.5.2.min.js перед ссылкой на fullcalendar.js которое предшествует$(document).ready(function ()
вызову. Однако код по-прежнему не выполняется. Если это неверно, не могли бы вы, пожалуйста, быть более конкретными в своем ответе. Я не знаю JavaScript и, следовательно, не осведомлен о его требованиях.
Ответ №2:
Чувак.. как говорит @pointy.. Для выполнения полного календаря требуется jQuery, прежде чем он сможет творить свое волшебство..
<!DOCTYPE html>
<html>
<head>
<link href="../Content/Site.css" rel="stylesheet" type="text/css" />
<link rel='stylesheet' type='text/css' href='~/Content/fullcalendar.css' />
<link rel='stylesheet' type='text/css' href='~/Content/fullcalendar.print.css' media='print' />
<script src="/Scripts/jquery-1.4.4.js" type="text/javascript"></script>
<script type='text/javascript' src='~/Scripts/fullcalendar.js'></script>
<script type='text/javascript' src='~/Scripts/gcal.js'></script>
Важно, чтобы весь ваш импорт выполнялся в верхнем порядке! Например, Сгруппируйте CSS, затем Sctipts. Легче прочитать позже
Редактировать
Картинка стоит тысячи слов!Я получил это из мини-сайта, который вы создали
Похоже, что он вообще не может найти скрипты.!
Комментарии:
1. @ppumkin Ваш ответ отобразился после того, как я обновил IE. К тому времени я уже отправил ответ Pointy. Повторяю этот ответ, он по-прежнему не работает, когда я перемещаю все в
<head>
раздел с сайта. Главная страница2. Используете mastersite? Тогда код должен быть полностью другим. я думаю. эта страница загружена с главного сайта.. или это страница mastersite?!
3. @ppumpkin Что вы имеете в виду — «должно быть совершенно иначе». Не могли бы вы, пожалуйста, объяснить подробнее или дать мне несколько ссылок на веб-сайт.
4. извините, я думал, вы имели в виду masterpages.. это что-то другое.. что ж, это должно сработать. можете ли вы показать нам свой сайт или демонстрационный сайт, где это не работает .. потому что что-то еще может быть не так
5. Также — попробуйте обновить свой jquery до 1.6.x, особенно если вы используете calendaer 1.5.x!
Ответ №3:
Pointy правильно определяет порядок, и чтобы убедиться, что у вас есть ссылка на Jquery, прежде чем ссылаться на полный календарь. В моем случае я сделал это правильно, но дополнительно я добавил частичное представление после заголовка. В частичном представлении снова была ссылка на Jquery, которая затем вызвала ту же ошибку при выполнении.
Я просто подумал, что добавлю это в качестве ответа, потому что это заставило меня некоторое время искать, прежде чем я понял, что происходит (потому что мой раздел head действительно имел правильный порядок — точно так, как предполагает anser от pointy, вы должны иметь).
Опять же, не пытаясь ничего исключить из другого правильного ответа. Просто добавляю, из-за чего конкретно у меня появилась ошибка — когда казалось, что я все сделал правильно — и все равно получил ошибку.
Решением для меня было убрать ссылку на jquery из частичного представления. (это не было необходимо, поскольку в главном представлении уже была ссылка)