如何解决在选择的日期显示错误的模式弹出窗口
我正在使用全日历,我真的想在选择的日期显示弹出模式。我已经尝试过,但是当我单击全历时,显示错误Uncaught TypeError: $(...).modal is not a function
。
这是标题代码
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.js"></script>
这是JS代码
$(document).ready(function(){
var calendar = $('#calendar').fullCalendar({
editable:true,header:{
left:'prev,next today',center:'title',right:'month,agendaWeek,agendaDay'
},events:"<?php echo base_url(); ?>fullcalendar/load",selectable:true,selectHelper:true,minTime: "05:00:00",maxTime: "24:30:00",slotDuration: '00:15',slotLabelFormat:"HH:mm",height: 550,select:function(start,end,allDay)
{
$('#fullCalModal').modal();
},});
});
这是html代码
<div class="container">
<div id="calendar" style="width:45%"></div>
</div>
<div id="fullCalModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span> <span class="sr-only">close</span></button>
<h4 id="modalTitle" class="modal-title"></h4>
</div>
<div id="modalBody" class="modal-body"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<a class="btn btn-primary" id="eventUrl" target="_blank">Event Page</a>
</div>
</div>
</div>
</div>
谢谢
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。