FullCalendar - Добавить ссылки на события

Привет, я пытаюсь использовать плагин fullcalendar для создания календаря.FullCalendar - Добавить ссылки на события

<!DOCTYPE html> 
<html> 
<head> 
<meta charset='utf-8' /> 
<link href='fullcalendar.css' rel='stylesheet' /> 
<link href='fullcalendar.print.css' rel='stylesheet' media='print' /> 
<script src='moment.min.js'></script> 
<script src='jquery.min.js'></script> 
<script src='fullcalendar.min.js'></script> 
<script> 

    $(document).ready(function() { 

     $('#calendar').fullCalendar({ 
      header: { 
       left: 'prev,next today', 
       center: 'title', 
       right: 'month,agendaWeek,agendaDay' 
      }, 

      selectable: true, 
      selectHelper: true, 

      select: function(start, end) { 
       var title = prompt('Event title'); 
       var eventData; 
       if (title) { 
        eventData = { 
         title: title, 
         start: start, 
         end: end 
        }; 
        $('#calendar').fullCalendar('renderEvent', eventData, true); // stick? = true 
       } 
       $('#calendar').fullCalendar('unselect'); 
      }, 
      editable: true, 
      eventLimit: true, // allow "more" link when too many events 

      events: [ 
       { 
        title: 'All Day Event', 
        start: '2015-12-01' 
       }, 
       { 
        title: 'Long Event', 
        start: '2015-12-07', 
        end: '2015-12-10' 
       }, 
       { 
        id: 999, 
        title: 'Repeating Event', 
        start: '2015-12-09T16:00:00' 
       }, 
       { 
        id: 999, 
        title: 'Repeating Event', 
        start: '2015-12-16T16:00:00' 
       }, 
       { 
        title: 'Conference', 
        start: '2015-12-11', 
        end: '2015-12-13' 
       }, 
       { 
        title: 'Meeting', 
        start: '2015-12-12T10:30:00', 
        end: '2015-12-12T12:30:00' 
       }, 
       { 
        title: 'Lunch', 
        start: '2015-12-12T12:00:00' 
       }, 
       { 
        title: 'Meeting', 
        start: '2015-12-12T14:30:00' 
       }, 
       { 
        title: 'Happy Hour', 
        start: '2015-12-12T17:30:00' 
       }, 
       { 
        title: 'Dinner', 
        start: '2015-12-12T20:00:00' 
       }, 
       { 
        title: 'Birthday Party', 
        start: '2015-12-13T07:00:00' 
       }, 
       { 
        title: 'Click for Google', 
        url: 'http://google.com/', 
        start: '2015-12-28' 
       } 
      ] 

     }); 

    }); 

</script> 
<style> 

    body { 
     margin: 40px 10px; 
     padding: 0; 
     font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif; 
     font-size: 14px; 
    } 

    #calendar { 
     max-width: 900px; 
     margin: 0 auto; 
    } 

</style> 
</head> 
<body> 

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

</body> 
</html>

Вот коды. Однако я хочу сделать это так, чтобы, когда человек нажимает на какую-либо дату, он перенаправляет их на другую страницу html. я пошел на исследование в Интернете и выяснил, что он получил ссылку на функцию dayclick или eventclick. Однако я действительно не знаю, как подать заявку на это, чтобы удовлетворить мои потребности. надеюсь, кто-нибудь может мне помочь. Помощь будет оценена много. Заранее спасибо. :)

источник

2016-01-04 Sukiyam

Вы можете просто использовать свойство URL-адрес в данных о событии следующим образом:

events: [ 
    { 
    title: 'All Day Event', 
    start: '2015-12-01', 
    url: 'http://google.com' 
    }

Если вы посмотрите на документы здесь: http://fullcalendar.io/docs/event_data/Event_Object/ вы можете увидеть все различные свойства, которые вы можете использовать.

источник

2016-01-04 17:47:49 Harry

, что не работает. – Ovis

использование:

выберите: функция()

<!DOCTYPE html> 
<html> 
<head> 
<meta charset='utf-8' /> 
<link href='fullcalendar.css' rel='stylesheet' /> 
<link href='fullcalendar.print.css' rel='stylesheet' media='print' /> 
<script src='moment.min.js'></script> 
<script src='jquery.min.js'></script> 
<script src='fullcalendar.min.js'></script> 
<script> 

    $(document).ready(function() { 

     $('#calendar').fullCalendar({ 
      header: { 
       left: 'prev,next today', 
       center: 'title', 
       right: 'month,agendaWeek,agendaDay' 
      }, 

      selectable: true, 
      selectHelper: true, 
      select: function(start, end, jsEvent, view){ 
       //wrtie your redirection code here 
       var root_url="http://localhost/"; 
       window.location = root_url+"test1.html" 
      }, 
      editable: true, 
      eventLimit: true, // allow "more" link when too many events 

      events: [ 
       { 
        title: 'All Day Event', 
        start: '2015-12-01' 
       }, 
       { 
        title: 'Long Event', 
        start: '2015-12-07', 
        end: '2015-12-10' 
       }, 
       { 
        id: 999, 
        title: 'Repeating Event', 
        start: '2015-12-09T16:00:00' 
       }, 
       { 
        id: 999, 
        title: 'Repeating Event', 
        start: '2015-12-16T16:00:00' 
       }, 
       { 
        title: 'Conference', 
        start: '2015-12-11', 
        end: '2015-12-13' 
       }, 
       { 
        title: 'Meeting', 
        start: '2015-12-12T10:30:00', 
        end: '2015-12-12T12:30:00' 
       }, 
       { 
        title: 'Lunch', 
        start: '2015-12-12T12:00:00' 
       }, 
       { 
        title: 'Meeting', 
        start: '2015-12-12T14:30:00' 
       }, 
       { 
        title: 'Happy Hour', 
        start: '2015-12-12T17:30:00' 
       }, 
       { 
        title: 'Dinner', 
        start: '2015-12-12T20:00:00' 
       }, 
       { 
        title: 'Birthday Party', 
        start: '2015-12-13T07:00:00' 
       }, 
       { 
        title: 'Click for Google', 
        url: 'http://google.com/', 
        start: '2015-12-28' 
       } 
      ] 

     }); 

    }); 

</script> 
<style> 

    body { 
     margin: 40px 10px; 
     padding: 0; 
     font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif; 
     font-size: 14px; 
    } 

    #calendar { 
     max-width: 900px; 
     margin: 0 auto; 
    } 

</style> 
</head> 
<body> 

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

источник

2016-01-04 18:32:37

привет, спасибо за ваш ответ. Но могу ли я задать вам довольно глупый вопрос о том, как написать код перенаправления? если мое перенаправление относится к файлу с именем testing.html. как мне его написать? – Sukiyam

window.location = "http://www.stackoverflow.com"; –

привет, спасибо за ваш ответ, он решил это для меня, спасибо большое. : ') – Sukiyam

FullCalendar - Добавить ссылки на события

ответ

Смежные вопросы