因此,我正在研究全日历并将其与AdminLTE集成。我有想要的输出
但后来我意识到,引导折叠按钮不起作用或没有反应,还有其他可点击的功能。我试图检查脚本并发现它与<script src='fullcalendar-2.5.0/lib/jquery.min.js'></script>
有关,因为当我尝试删除它时,它又可以工作了,但是日历变得像这样
这是我的脚本:尽管我已经尝试将jquery.min.js放在顶部,但仍然没有任何反应,这与脚本的顺序有关吗?任何帮助,将不胜感激。
<!-- jQuery 2.1.4 -->
<script src="plugins/jQuery/jQuery-2.1.4.min.js"></script>
<!-- jQuery UI 1.11.4 -->
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
<script>
$.widget.bridge('uibutton', $.ui.button);
</script>
<!-- Bootstrap 3.3.5 -->
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="bootstrap/js/moment.js"></script>
<!-- Morris.js charts -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="plugins/morris/morris.min.js"></script>
<!-- Sparkline -->
<script src="plugins/sparkline/jquery.sparkline.min.js"></script>
<!-- jvectormap -->
<script src="plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
<script src="plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
<!-- jQuery Knob Chart -->
<script src="plugins/knob/jquery.knob.js"></script>
<!-- daterangepicker -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.2/moment.min.js"></script>
<script src="plugins/daterangepicker/daterangepicker.js"></script>
<!-- datepicker -->
<script src="plugins/datepicker/bootstrap-datepicker.js"></script>
<!-- Bootstrap WYSIHTML5 -->
<script src="plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
<!-- Slimscroll -->
<script src="plugins/slimScroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="plugins/fastclick/fastclick.min.js"></script>
<!-- AdminLTE App -->
<script src="dist/js/app.min.js"></script>
<!-- AdminLTE dashboard demo (This is only for demo purposes) -->
<script src="dist/js/pages/dashboard.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="dist/js/demo.js"></script>
<script src='fullcalendar-2.5.0/lib/jquery.min.js'></script>
<script src='fullcalendar-2.5.0/lib/jquery-ui.custom.min.js'></script>
<script src='fullcalendar-2.5.0/fullcalendar.min.js'></script>
日历html:
<div class="box box-danger table-responsive">
<div class="box-header">
<i class="fa fa-calendar"></i>
<h3 class="box-title">Calendar</h3>
<div class="box-tools pull-right">
<button class="btn btn-box-tool pull-right " data-widget="collapse"><i class="fa fa-minus"></i></button>
<button type="button" class="btn btn-info btn-sm pull-right" data-toggle="modal" data-target="#myModal1">Add</button>
<!-- Trigger the modal with a button -->
<!-- Modal --> </div><!-- /.box-tools -->
</div><!-- /.box-header -->
<div class="box-body pad">
<div id='calendar'></div>
</div><!-- /.box-body -->
</div><!-- /.box -->
最佳答案
尝试这个:
<button class="btn btn-box-tool pull-right " data-target=".navbar-collapse">
<i class="fa fa-minus"></i>
</button>
或者,如果这不起作用,请尝试以下操作:
$(document).ready(function(){
$(".btn-box-tool").click(function(){
$("#calendar").slideUp("slow");
});
});