首先,我没有JavaScript经验。虽然我打算坐下来彻底学习语言,但现在我只是一个HTML / CSS人。我这样说是为了避免因为回应而心烦意乱。
我对自己继承的网站存在问题。他们使用了我认为是其他人为脚本编写的脚本来创建一个图像滑块,并且页面不断回复我在标题中提到的错误。我发布了代码,希望有人可以帮我修复它(并在这个过程中教我一些关于JavaScript的东西)。
代码: Google Developer工具发送的错误发生在最后一行(JQuery)
// JavaScript Document
$(document).ready(function($) {
$.fn.lofJSidernews = function( settings ) {
return this.each(function() {
// get instance of the lofSiderNew.
new $.lofSidernews( this, settings );
});
}
$.lofSidernews = function( obj, settings ){
this.settings = {
mainItemSelector : 'li',
navInnerSelector : 'ul',
navSelector : 'li' ,
navigatorEvent : 'click'/* click|mouseenter */,
wapperSelector : '.sliders-wrap-inner',
interval : 5000,
startItem : 0,
navPosition : 'vertical',/* values: horizontal|vertical*/
duration : 1200,
navItemsSelector : '.navigator-wrap-inner li',
navOuterSelector : '.navigator-wrapper' ,
isPreloaded : true,
onPlaySlider:function(obj, slider){},
onComplete:function(slider, index){ }
}
$.extend( this.settings, settings ||{} );
this.nextNo = null;
this.previousNo = null;
this.maxWidth = this.settings.mainWidth || 684;
this.wrapper = $( obj ).find( this.settings.wapperSelector );
var wrapOuter = $('<div class="sliders-wrapper"></div>').width( this.maxWidth );
this.wrapper.wrap( wrapOuter );
this.slides = this.wrapper.find( this.settings.mainItemSelector );
if( !this.wrapper.length || !this.slides.length ) return ;
// set width of wapper
if( this.settings.maxItemDisplay > this.slides.length ){
this.settings.maxItemDisplay = this.slides.length;
}
this.currentNo = isNaN(this.settings.startItem)||this.settings.startItem > this.slides.length?0:this.settings.startItem;
this.navigatorOuter = $( obj ).find( this.settings.navOuterSelector );
this.navigatorItems = $( obj ).find( this.settings.navItemsSelector ) ;
this.navigatorInner = this.navigatorOuter.find( this.settings.navInnerSelector );
// if use automactic calculate width of navigator
if( this.settings.navigatorHeight == null || this.settings.navigatorWidth == null ){
this.settings.navigatorHeight = this.navigatorItems.eq(0).outerWidth(true);
this.settings.navigatorWidth = this.navigatorItems.eq(0).outerHeight(true);
}
if( this.settings.navPosition == 'horizontal' ){
this.navigatorInner.width( this.slides.length * this.settings.navigatorWidth );
this.navigatorOuter.width( this.settings.maxItemDisplay * this.settings.navigatorWidth );
this.navigatorOuter.height( this.settings.navigatorHeight );
} else {
this.navigatorInner.height( this.slides.length * this.settings.navigatorHeight );
this.navigatorOuter.height( this.settings.maxItemDisplay * this.settings.navigatorHeight );
this.navigatorOuter.width( this.settings.navigatorWidth );
}
this.slides.width( this.settings.mainWidth );
this.navigratorStep = this.__getPositionMode( this.settings.navPosition );
this.directionMode = this.__getDirectionMode();
if( this.settings.direction == 'opacity') {
this.wrapper.addClass( 'lof-opacity' );
$(this.slides).css({'opacity':0,'z-index':1}).eq(this.currentNo).css({'opacity':1,'z-index':3});
} else {
this.wrapper.css({'left':'-'+this.currentNo*this.maxSize+'px', 'width':( this.maxWidth ) * this.slides.length } );
}
if( this.settings.isPreloaded ) {
this.preLoadImage( this.onComplete );
} else {
this.onComplete();
}
$buttonControl = $( ".button-control", obj);
if( this.settings.auto ){
$buttonControl.addClass("action-stop");
} else {
$buttonControl.addClass("action-start");
}
var self = this;
$( obj ).hover(function(){
self.stop();
$buttonControl.addClass("action-start").removeClass("action-stop").addClass("hover-stop");
}, function(){
if( $buttonControl.hasClass("hover-stop") ){
if( self.settings.auto ){
$buttonControl.removeClass("action-start").removeClass("hover-stop").addClass("action-stop");
self.play( self.settings.interval,'next', true );
}
}
} );
$buttonControl.click( function() {
if( $buttonControl.hasClass("action-start") ){
self.settings.auto =true;
self.play( self.settings.interval,'next', true );
$buttonControl.removeClass("action-start").addClass("action-stop");
} else{
self.settings.auto =false;
self.stop();
$buttonControl.addClass("action-start").removeClass("action-stop");
}
} );
}
$.lofSidernews.fn = $.lofSidernews.prototype;
$.lofSidernews.fn.extend = $.lofSidernews.extend = $.extend;
$.lofSidernews.fn.extend({
startUp:function( obj, wrapper ) {
seft = this;
this.navigatorItems.each( function(index, item ){
$(item).bind( seft.settings.navigatorEvent,( function(){
seft.jumping( index, true );
seft.setNavActive( index, item );
} ));
$(item).css( {'height': seft.settings.navigatorHeight, 'width': seft.settings.navigatorWidth} );
})
this.registerWheelHandler( this.navigatorOuter, this );
this.setNavActive( this.currentNo );
this.settings.onComplete( this.slides.eq(this.currentNo ),this.currentNo );
if( this.settings.buttons && typeof (this.settings.buttons) == "object" ){
this.registerButtonsControl( 'click', this.settings.buttons, this );
}
if( this.settings.auto )
this.play( this.settings.interval,'next', true );
return this;
},
onComplete:function(){
setTimeout( function(){ $('.preload').fadeOut( 900, function(){ $('.preload').remove(); } ); }, 400 ); this.startUp( );
},
preLoadImage:function( callback ){
var self = this;
var images = this.wrapper.find( 'img' );
var count = 0;
images.each( function(index,image){
if( !image.complete ){
image.onload =function(){
count++;
if( count >= images.length ){
self.onComplete();
}
}
image.onerror =function(){
count++;
if( count >= images.length ){
self.onComplete();
}
}
}else {
count++;
if( count >= images.length ){
self.onComplete();
}
}
} );
},
navivationAnimate:function( currentIndex ) {
if (currentIndex <= this.settings.startItem
|| currentIndex - this.settings.startItem >= this.settings.maxItemDisplay-1) {
this.settings.startItem = currentIndex - this.settings.maxItemDisplay+2;
if (this.settings.startItem < 0) this.settings.startItem = 0;
if (this.settings.startItem >this.slides.length-this.settings.maxItemDisplay) {
this.settings.startItem = this.slides.length-this.settings.maxItemDisplay;
}
}
this.navigatorInner.stop().animate( eval('({'+this.navigratorStep[0]+':-'+this.settings.startItem*this.navigratorStep[1]+'})'),
{duration:500, easing:'easeInOutQuad'} );
},
setNavActive:function( index, item ){
if( (this.navigatorItems) ){
this.navigatorItems.removeClass( 'active' );
$(this.navigatorItems.get(index)).addClass( 'active' );
this.navivationAnimate( this.currentNo );
}
},
__getPositionMode:function( position ){
if( position == 'horizontal' ){
return ['left', this.settings.navigatorWidth];
}
return ['top', this.settings.navigatorHeight];
},
__getDirectionMode:function(){
switch( this.settings.direction ){
case 'opacity': this.maxSize=0; return ['opacity','opacity'];
default: this.maxSize=this.maxWidth; return ['left','width'];
}
},
registerWheelHandler:function( element, obj ){
element.bind('mousewheel', function(event, delta ) {
var dir = delta > 0 ? 'Up' : 'Down',
vel = Math.abs(delta);
if( delta > 0 ){
obj.previous( true );
} else {
obj.next( true );
}
return false;
});
},
registerButtonsControl:function( eventHandler, objects, self ){
for( var action in objects ){
switch (action.toString() ){
case 'next':
objects[action].click( function() { self.next( true) } );
break;
case 'previous':
objects[action].click( function() { self.previous( true) } );
break;
}
}
return this;
},
onProcessing:function( manual, start, end ){
this.previousNo = this.currentNo + (this.currentNo>0 ? -1 : this.slides.length-1);
this.nextNo = this.currentNo + (this.currentNo < this.slides.length-1 ? 1 : 1- this.slides.length);
return this;
},
finishFx:function( manual ){
if( manual ) this.stop();
if( manual && this.settings.auto ){
this.play( this.settings.interval,'next', true );
}
this.setNavActive( this.currentNo );
this.settings.onPlaySlider( this, $(this.slides).eq(this.currentNo) );
},
getObjectDirection:function( start, end ){
return eval("({'"+this.directionMode[0]+"':-"+(this.currentNo*start)+"})");
},
fxStart:function( index, obj, currentObj ){
var s = this;
if( this.settings.direction == 'opacity' ) {
$(this.slides).stop().animate({opacity:0}, {duration: this.settings.duration, easing:this.settings.easing,complete:function(){
s.slides.css("z-index","1")
s.slides.eq(index).css("z-index","3");
}} );
$(this.slides).eq(index).stop().animate( {opacity:1}, { duration : this.settings.duration,
easing :this.settings.easing,
complete :function(){ s.settings.onComplete($(s.slides).eq(index),index); }} );
}else {
this.wrapper.stop().animate( obj, {duration: this.settings.duration, easing:this.settings.easing,complete:function(){
s.settings.onComplete($(s.slides).eq(index),index)
} } );
}
return this;
},
jumping:function( no, manual ){
this.stop();
if( this.currentNo == no ) return;
var obj = eval("({'"+this.directionMode[0]+"':-"+(this.maxSize*no)+"})");
this.onProcessing( null, manual, 0, this.maxSize )
.fxStart( no, obj, this )
.finishFx( manual );
this.currentNo = no;
},
next:function( manual , item){
this.currentNo += (this.currentNo < this.slides.length-1) ? 1 : (1 - this.slides.length);
this.onProcessing( item, manual, 0, this.maxSize )
.fxStart( this.currentNo, this.getObjectDirection(this.maxSize ), this )
.finishFx( manual );
},
previous:function( manual, item ){
this.currentNo += this.currentNo > 0 ? -1 : this.slides.length - 1;
this.onProcessing( item, manual )
.fxStart( this.currentNo, this.getObjectDirection(this.maxSize ), this )
.finishFx( manual );
},
play:function( delay, direction, wait ){
this.stop();
if(!wait){ this[direction](false); }
var self = this;
this.isRun = setTimeout(function() { self[direction](true); }, delay);
},
stop:function(){
if (this.isRun == null) return;
clearTimeout(this.isRun);
this.isRun = null;
}
})
})(jQuery)
我收到的最后一行是未捕获的TypeError:对象不是函数
有什么想法吗?
答案 0 :(得分:3)
$(document).ready(function($) {
不返回功能,因此您应该删除
})(jQuery)
并替换为
});
此外,无需将$
传递给就绪处理程序,您可以从以下位置简化它:
$(document).ready(function($) {
要
$( function() {