Fatal编程技术网

Javascript，Can'；找不到变量

javascript jquery html variables

Javascript，Can'；找不到变量,javascript,jquery,html,variables,Javascript,Jquery,Html,Variables,我正在尝试将javascript calendar（）添加到我的网站。所以我添加了HTML代码，附加了js和css文件。加载页面时，控制台中出现以下错误： [Error] ReferenceError: Can't find variable: jQuery global code (jquery.calendario.js, line 388) [Error] ReferenceError: Can't find variable: jQuery global code (da

我正在尝试将javascript calendar（）添加到我的网站。所以我添加了HTML代码，附加了js和css文件。加载页面时，控制台中出现以下错误：

[Error] ReferenceError: Can't find variable: jQuery
    global code (jquery.calendario.js, line 388)
[Error] ReferenceError: Can't find variable: jQuery
    global code (dashboard, line 139)
我检查了
jquery.calendario.js
，
第388行
的错误，它有以下代码： 
}（jQuery，窗口）

同样在仪表板文件中，
第139行
：

jQuery（函数（）{
）

有没有办法解决这个问题

更新


<script type="text/javascript" src="{% static "js/jquery.calendario.js" %}"></script>
<script type="text/javascript" src="{% static "js/data.js" %}"></script>
<script type="text/javascript">
    jQuery(function() {

        var transEndEventNames = {
                'WebkitTransition' : 'webkitTransitionEnd',
                'MozTransition' : 'transitionend',
                'OTransition' : 'oTransitionEnd',
                'msTransition' : 'MSTransitionEnd',
                'transition' : 'transitionend'
            },
            transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ],
            $wrapper = $( '#custom-inner' ),
            $calendar = $( '#calendar' ),
            cal = $calendar.calendario( {
                onDayClick : function( $el, $contentEl, dateProperties ) {

                    if( $contentEl.length > 0 ) {
                        showEvents( $contentEl, dateProperties );
                    }

                },
                caldata : codropsEvents,
                displayWeekAbbr : true
            } ),
            $month = $( '#custom-month' ).html( cal.getMonthName() ),
            $year = $( '#custom-year' ).html( cal.getYear() );

        $( '#custom-next' ).on( 'click', function() {
            cal.gotoNextMonth( updateMonthYear );
        } );
        $( '#custom-prev' ).on( 'click', function() {
            cal.gotoPreviousMonth( updateMonthYear );
        } );

        function updateMonthYear() {
            $month.html( cal.getMonthName() );
            $year.html( cal.getYear() );
        }

        // just an example..
        function showEvents( $contentEl, dateProperties ) {

            hideEvents();

            var $events = $( '<div id="custom-content-reveal" class="custom-content-reveal"><h4>Events for ' + dateProperties.monthname + ' ' + dateProperties.day + ', ' + dateProperties.year + '</h4></div>' ),
                $close = $( '<span class="custom-content-close"></span>' ).on( 'click', hideEvents );

            $events.append( $contentEl.html() , $close ).insertAfter( $wrapper );

            setTimeout( function() {
                $events.css( 'top', '0%' );
            }, 25 );

        }
        function hideEvents() {

            var $events = $( '#custom-content-reveal' );
            if( $events.length > 0 ) {

                $events.css( 'top', '100%' );
                Modernizr.csstransitions ? $events.on( transEndEventName, function() { $( this ).remove(); } ) : $events.remove();

            }

        }

    });
</script>


标题


<!-- Calendar CSS -->
<link href="{% static "css/calendar.css" %}" rel="stylesheet">
<link href="{% static "css/calendar-style.css" %}" rel="stylesheet">
<!-- Modernizr Custom -->
<script src="{% static "js/modernizr.custom.js" %}"></script>



<script type="text/javascript" src="{% static "js/jquery.calendario.js" %}"></script>
<script type="text/javascript" src="{% static "js/data.js" %}"></script>
<script type="text/javascript">
    jQuery(function() {

        var transEndEventNames = {
                'WebkitTransition' : 'webkitTransitionEnd',
                'MozTransition' : 'transitionend',
                'OTransition' : 'oTransitionEnd',
                'msTransition' : 'MSTransitionEnd',
                'transition' : 'transitionend'
            },
            transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ],
            $wrapper = $( '#custom-inner' ),
            $calendar = $( '#calendar' ),
            cal = $calendar.calendario( {
                onDayClick : function( $el, $contentEl, dateProperties ) {

                    if( $contentEl.length > 0 ) {
                        showEvents( $contentEl, dateProperties );
                    }

                },
                caldata : codropsEvents,
                displayWeekAbbr : true
            } ),
            $month = $( '#custom-month' ).html( cal.getMonthName() ),
            $year = $( '#custom-year' ).html( cal.getYear() );

        $( '#custom-next' ).on( 'click', function() {
            cal.gotoNextMonth( updateMonthYear );
        } );
        $( '#custom-prev' ).on( 'click', function() {
            cal.gotoPreviousMonth( updateMonthYear );
        } );

        function updateMonthYear() {
            $month.html( cal.getMonthName() );
            $year.html( cal.getYear() );
        }

        // just an example..
        function showEvents( $contentEl, dateProperties ) {

            hideEvents();

            var $events = $( '<div id="custom-content-reveal" class="custom-content-reveal"><h4>Events for ' + dateProperties.monthname + ' ' + dateProperties.day + ', ' + dateProperties.year + '</h4></div>' ),
                $close = $( '<span class="custom-content-close"></span>' ).on( 'click', hideEvents );

            $events.append( $contentEl.html() , $close ).insertAfter( $wrapper );

            setTimeout( function() {
                $events.css( 'top', '0%' );
            }, 25 );

        }
        function hideEvents() {

            var $events = $( '#custom-content-reveal' );
            if( $events.length > 0 ) {

                $events.css( 'top', '100%' );
                Modernizr.csstransitions ? $events.on( transEndEventName, function() { $( this ).remove(); } ) : $events.remove();

            }

        }

    });
</script>



<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>
</head>






HTML


  <div class="custom-calendar-wrap">
    <div id="custom-inner" class="custom-inner">
      <div class="custom-header clearfix">
        <span id="custom-prev" class="custom-prev"></span> <span id="custom-next" class=
        "custom-next"></span>

        <h2 id="custom-month" class="custom-month"></h2>

        <h3 id="custom-year" class="custom-year"></h3>
      </div>

      <div id="calendar" class="fc-calendar-container"></div>
    </div>
  </div>



<script type="text/javascript" src="{% static "js/jquery.calendario.js" %}"></script>
<script type="text/javascript" src="{% static "js/data.js" %}"></script>
<script type="text/javascript">
    jQuery(function() {

        var transEndEventNames = {
                'WebkitTransition' : 'webkitTransitionEnd',
                'MozTransition' : 'transitionend',
                'OTransition' : 'oTransitionEnd',
                'msTransition' : 'MSTransitionEnd',
                'transition' : 'transitionend'
            },
            transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ],
            $wrapper = $( '#custom-inner' ),
            $calendar = $( '#calendar' ),
            cal = $calendar.calendario( {
                onDayClick : function( $el, $contentEl, dateProperties ) {

                    if( $contentEl.length > 0 ) {
                        showEvents( $contentEl, dateProperties );
                    }

                },
                caldata : codropsEvents,
                displayWeekAbbr : true
            } ),
            $month = $( '#custom-month' ).html( cal.getMonthName() ),
            $year = $( '#custom-year' ).html( cal.getYear() );

        $( '#custom-next' ).on( 'click', function() {
            cal.gotoNextMonth( updateMonthYear );
        } );
        $( '#custom-prev' ).on( 'click', function() {
            cal.gotoPreviousMonth( updateMonthYear );
        } );

        function updateMonthYear() {
            $month.html( cal.getMonthName() );
            $year.html( cal.getYear() );
        }

        // just an example..
        function showEvents( $contentEl, dateProperties ) {

            hideEvents();

            var $events = $( '<div id="custom-content-reveal" class="custom-content-reveal"><h4>Events for ' + dateProperties.monthname + ' ' + dateProperties.day + ', ' + dateProperties.year + '</h4></div>' ),
                $close = $( '<span class="custom-content-close"></span>' ).on( 'click', hideEvents );

            $events.append( $contentEl.html() , $close ).insertAfter( $wrapper );

            setTimeout( function() {
                $events.css( 'top', '0%' );
            }, 25 );

        }
        function hideEvents() {

            var $events = $( '#custom-content-reveal' );
            if( $events.length > 0 ) {

                $events.css( 'top', '100%' );
                Modernizr.csstransitions ? $events.on( transEndEventName, function() { $( this ).remove(); } ) : $events.remove();

            }

        }

    });
</script>






之前


<script type="text/javascript" src="{% static "js/jquery.calendario.js" %}"></script>
<script type="text/javascript" src="{% static "js/data.js" %}"></script>
<script type="text/javascript">
    jQuery(function() {

        var transEndEventNames = {
                'WebkitTransition' : 'webkitTransitionEnd',
                'MozTransition' : 'transitionend',
                'OTransition' : 'oTransitionEnd',
                'msTransition' : 'MSTransitionEnd',
                'transition' : 'transitionend'
            },
            transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ],
            $wrapper = $( '#custom-inner' ),
            $calendar = $( '#calendar' ),
            cal = $calendar.calendario( {
                onDayClick : function( $el, $contentEl, dateProperties ) {

                    if( $contentEl.length > 0 ) {
                        showEvents( $contentEl, dateProperties );
                    }

                },
                caldata : codropsEvents,
                displayWeekAbbr : true
            } ),
            $month = $( '#custom-month' ).html( cal.getMonthName() ),
            $year = $( '#custom-year' ).html( cal.getYear() );

        $( '#custom-next' ).on( 'click', function() {
            cal.gotoNextMonth( updateMonthYear );
        } );
        $( '#custom-prev' ).on( 'click', function() {
            cal.gotoPreviousMonth( updateMonthYear );
        } );

        function updateMonthYear() {
            $month.html( cal.getMonthName() );
            $year.html( cal.getYear() );
        }

        // just an example..
        function showEvents( $contentEl, dateProperties ) {

            hideEvents();

            var $events = $( '<div id="custom-content-reveal" class="custom-content-reveal"><h4>Events for ' + dateProperties.monthname + ' ' + dateProperties.day + ', ' + dateProperties.year + '</h4></div>' ),
                $close = $( '<span class="custom-content-close"></span>' ).on( 'click', hideEvents );

            $events.append( $contentEl.html() , $close ).insertAfter( $wrapper );

            setTimeout( function() {
                $events.css( 'top', '0%' );
            }, 25 );

        }
        function hideEvents() {

            var $events = $( '#custom-content-reveal' );
            if( $events.length > 0 ) {

                $events.css( 'top', '100%' );
                Modernizr.csstransitions ? $events.on( transEndEventName, function() { $( this ).remove(); } ) : $events.remove();

            }

        }

    });
</script>




jQuery（函数（）{
var transEndEventNames={
“WebKittTransition”：“WebKittTransitionEnd”，
'MozTransition'：'transitionend'，
“OTransition”：“oTransitionEnd”，
“msTransition”：“MSTransitionEnd”，
“transition”：“transitionend”
},
transEndEventName=transEndEventNames[现代化前缀（'transition'）]，
$wrapper=$（“#自定义内部”），
$calendar=$（“#calendar”），
cal=$calendar.calendario（{
onDayClick:函数（$el、$contentEl、dateProperties）{
如果（$contentEl.length>0）{
showEvents（$contentEl、dateProperties）；
}
},
caldata:codropsEvents，
displayWeekAbbr：对
} ),
$month=$（“#自定义月”）.html（cal.getMonthName（）），
$year=$（'#自定义年份'）.html（cal.getYear（））；
$（“#自定义下一步”）。在（'click'，function（）上{
cal.GotonExtmount（updateMonthYear）；
} );
$（“#自定义上一页”）。在（'click'，function（）上{
cal.GotoPrevious Month（updateMonthYear）；
} );
函数updateMonthYear（）{
$month.html（cal.getMonthName（））；
$year.html（cal.getYear（））；
}
//只是一个例子。。
函数showEvents（$contentEl，dateProperties）{
隐藏事件（）；
var$events=$（'events for'+dateProperties.monthname+''+dateProperties.day+'，'+dateProperties.year+''）的事件，
$close=$（''）.on（'click'，hideEvents）；
$events.append（$contentEl.html（），$close）.insertAfter（$wrapper）；
setTimeout（函数（）{
$events.css（'top'，'0%'）；
}, 25 );
}
函数hideEvents（）{
var$events=$（“#自定义内容显示”）；
如果（$events.length>0）{
$events.css（'top'，'100%'）；
Modernizer.csTranslations？$events.on（transEndEventName，function（）{$（this.remove（）；}）：$events.remove（）；
}
}
});



另外，这是一个django项目，因此，
{%static”…“%}
您是否将jQuery库文件添加到html文档中了

标题


<!-- Calendar CSS -->
<link href="{% static "css/calendar.css" %}" rel="stylesheet">
<link href="{% static "css/calendar-style.css" %}" rel="stylesheet">
<!-- Modernizr Custom -->
<script src="{% static "js/modernizr.custom.js" %}"></script>



<script type="text/javascript" src="{% static "js/jquery.calendario.js" %}"></script>
<script type="text/javascript" src="{% static "js/data.js" %}"></script>
<script type="text/javascript">
    jQuery(function() {

        var transEndEventNames = {
                'WebkitTransition' : 'webkitTransitionEnd',
                'MozTransition' : 'transitionend',
                'OTransition' : 'oTransitionEnd',
                'msTransition' : 'MSTransitionEnd',
                'transition' : 'transitionend'
            },
            transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ],
            $wrapper = $( '#custom-inner' ),
            $calendar = $( '#calendar' ),
            cal = $calendar.calendario( {
                onDayClick : function( $el, $contentEl, dateProperties ) {

                    if( $contentEl.length > 0 ) {
                        showEvents( $contentEl, dateProperties );
                    }

                },
                caldata : codropsEvents,
                displayWeekAbbr : true
            } ),
            $month = $( '#custom-month' ).html( cal.getMonthName() ),
            $year = $( '#custom-year' ).html( cal.getYear() );

        $( '#custom-next' ).on( 'click', function() {
            cal.gotoNextMonth( updateMonthYear );
        } );
        $( '#custom-prev' ).on( 'click', function() {
            cal.gotoPreviousMonth( updateMonthYear );
        } );

        function updateMonthYear() {
            $month.html( cal.getMonthName() );
            $year.html( cal.getYear() );
        }

        // just an example..
        function showEvents( $contentEl, dateProperties ) {

            hideEvents();

            var $events = $( '<div id="custom-content-reveal" class="custom-content-reveal"><h4>Events for ' + dateProperties.monthname + ' ' + dateProperties.day + ', ' + dateProperties.year + '</h4></div>' ),
                $close = $( '<span class="custom-content-close"></span>' ).on( 'click', hideEvents );

            $events.append( $contentEl.html() , $close ).insertAfter( $wrapper );

            setTimeout( function() {
                $events.css( 'top', '0%' );
            }, 25 );

        }
        function hideEvents() {

            var $events = $( '#custom-content-reveal' );
            if( $events.length > 0 ) {

                $events.css( 'top', '100%' );
                Modernizr.csstransitions ? $events.on( transEndEventName, function() { $( this ).remove(); } ) : $events.remove();

            }

        }

    });
</script>



<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>
</head>





1.您是否包括jQuery以及您的日历脚本？2.您是否在日历脚本之前包括它？将
jQuery
引用添加到您的HTML。@scrowler我在问题中添加了代码，以便您可以查看顺序。您是对的！不是我忘记了，而是因为我的模板在Django中，jQuery是在脚本初始值之后添加的谢谢!！