未调用Javascript

也许我错过了一个非常重要的步骤,但是我试图使用laravel实现一个简单的日历。 我的JavaScript没有被调用。我还可以确保在另一个表中,来自控制器的数据不为空。已经dd并检查了。

以下是我的代码。我的浏览器没有错误。警报或console.log中也没有任何内容。 非常感谢您的帮助,以使它运行起来。

@extends('layouts.app')

@section('content')

<h3 class="page-title">@lang('Test calendar Appointement')</h3>
<div id='calendar'></div>
@stop
@section('javascript')
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.min.js'></script>
<script>
    $(document).ready(function() {
            // page is now ready, initialize the calendar...
            alert("here");
            console.log("here");
            $('#calendar').fullCalendar({
                // put your options and callbacks here
                defaultView: 'agendaWeek',
                events : [
                @foreach($appointments as $appointment)
                {
                    title : '{{ $appointment->user->first_name . ' ' . $appointment->user->last_name }}',
                    start : '{{ $appointment->start_time }}',
                    @if ($appointment->finish_time)
                    end: '{{ $appointment->finish_time }}',
                    @endif

                },
                @endforeach
                ]
            })
        });
    </script>
    @endsection
评论
  • 之冰巧
    之冰巧 回复

    您的JavaScript代码可以正常工作在以下代码段中,但 您的代码中还有另一个问题,也许是在生成事件中

    <div id="calendar"></div>
    
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js'></script>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.min.js'></script>
    <script>
        $(document).ready(function() {
                // page is now ready, initialize the calendar...
                alert("here");
                console.log("here");
                $('#calendar').fullCalendar({
                    // put your options and callbacks here
                    defaultView: 'agendaWeek',
                    events : [    ]
                })
            });
        </script>