Javascript JQuery 1.61版的JQuery.on（）函数替代方案
我遇到了一种情况，我需要修改一个与JQuery 1.7.1一起使用的脚本，以与JQuery 1.6.1一起使用，基本上我需要将.on（）转换为与JQuery 1.6.1一起使用的脚本 下面是我需要在JQuery 1.6.1（change.on（）函数）下运行的代码：Javascript JQuery 1.61版的JQuery.on（）函数替代方案,javascript,jquery,conflict,Javascript,Jquery,Conflict,我遇到了一种情况，我需要修改一个与JQuery 1.7.1一起使用的脚本，以与JQuery 1.6.1一起使用，基本上我需要将.on（）转换为与JQuery 1.6.1一起使用的脚本 下面是我需要在JQuery 1.6.1（change.on（）函数）下运行的代码： （函数（$，未定义）{ /* *滑块对象。 */ $.Slider=函数（选项，元素）{ 该.$el=$（元素）； 这是._init（选项）； }; $.Slider.defaults={ 当前：0，//当前幻灯片的索引 bginc
（函数（$，未定义）{
/*
*滑块对象。
*/
$.Slider=函数（选项，元素）{
该.$el=$（元素）；
这是._init（选项）；
};
$.Slider.defaults={
当前：0，//当前幻灯片的索引
bgincrement:50，//滑动时增加bg位置（视差效果）
自动播放：false，//打开/关闭幻灯片放映
时间间隔：4000//两次转换之间的时间
};
$.Slider.prototype={
_初始化：函数（选项）{
this.options=$.extend（true，{}，$.Slider.defaults，options）；
this.$slides=this.$el.children（'div.da-slide'）；
this.slidescont=this.$slides.length；
this.current=this.options.current；
如果（this.current<0 | | this.current>=this.slidescont）{
该电流=0；
}
this.slides.eq（this.current）.addClass（'da slide current'）；
变量$navigation=$（''）；
对于（变量i=0；ispan'）；
this.$navNext=this.$el.find（'span.da arrows next'）；
this.$navPrev=this.$el.find（'span.da arrows prev'）；
this.isAnimating=false；
此值为0.bgpositer=0；
this.cssAnimations=modernizer.cssAnimations；
这个.cstranitions=现代化.cstranitions；
如果（！this.cssAnimations | |！this.cssAnimations）{
这个.el.addClass（'da slider fb'）；
}
这是._updatePage（）；
//加载事件
这是；
//幻灯片放映
如果（this.options.autoplay）{
这个。_startSlideshow（）；
}
},
_导航：功能（页面，目录）{
var$current=this.$slides.eq（this.current），$next，_self=this；
如果（this.current==page | | this.isAnimating）返回false；
this.isAnimating=true；
//检查目录
变量classTo、classFrom、d；
如果（！dir）{
（页面>this.current）？d='next'：d='prev'；
}
否则{
d=dir；
}
if（this.cssAnimations&&this.cssAnimations）{
如果（d==‘下一步’）{
classTo='da slide toleft'；
classFrom='da slide fromright'；
++这是bgpositer；
}
否则{
classTo='da slide toright'；
classFrom='da slide from Left'；
--这是bgpositer；
}
this.$el.css（'background position'，this.bgpositer*this.options.bgpincrement+%0%）；
}
this.current=页面；
$next=this.$slides.eq（this.current）；
if（this.cssAnimations&&this.cssAnimations）{
var rmClasses='da幻灯片到左da幻灯片到右da幻灯片从左da幻灯片到右da幻灯片'；
$current.removeClass（rmClasses）；
$next.removeClass（rmClasses）；
$current.addClass（classTo）；
$next.addClass（classFrom）；
$current.removeClass（'da slide current'）；
$next.addClass（'da slide current'）；
}
//退路
如果（！this.cssAnimations | |！this.cssAnimations）{
$next.css（'left'，（d=='next'）？'100%：'-100%）.stop（）.animate（{
左：“0%”
}，1000，函数（）{
_自我美化=错误；
});
$current.stop（）.animate（{
左：（d=='next'）？'-100%：'100%'
}，1000，函数（）{
$current.removeClass（'da slide current'）；
});
}
这是._updatePage（）；
},
_updatePage:function（）{
这个.pages.removeClass（'da dots current'）；
this.$pages.eq（this.current）.addClass（'da dots current'）；
},
_startSlideshow:函数（）{
var _self=这个；
this.slideshow=setTimeout（函数（）{
var page=（\u self.current<\u self.slidescont-1）？page=\u self.current+1:page=0；
_自我导航（第页“下一页”）；
如果（_self.options.autoplay）{
_self._startSlideshow（）；
}
}，此为.options.interval）；
},
页面：功能（idx）{
如果（idx>=this.slideCount | | idx<0）{
返回false；
}
如果（this.options.autoplay）{
clearTimeout（this.slideshow）；
this.options.autoplay=false；
}
这个。导航（idx）；
},
_loadEvents:function（）{
var _self=这个；
此.$pages.on（'click.cslider'，函数（事件）{
_self.page（$（this.index（））；
返回false；
});
此.navNext.on（'click.cslider'，函数（事件）{
如果（_self.options.autoplay）{
clearTimeout（_self.slideshow）；
_self.options.autoplay=false；
}
var page=（\u self.current<\u self.slidescont-1）？page=\u self.current+1:page=0；
_自我导航（第页“下一页”）；
返回false；
});
此.navPrev.on（'click.cslider'，函数（事件）{
如果（_self.options.autoplay）{
clearTimeout（_self.slideshow）；
_self.options.autoplay=false；
}
变量页=（\u self.current>0）？页=\u self.current-1：页
(function( $, undefined ) {
/*
* Slider object.
*/
$.Slider = function( options, element ) {
this.$el = $( element );
this._init( options );
};
$.Slider.defaults = {
current : 0, // index of current slide
bgincrement : 50, // increment the bg position (parallax effect) when sliding
autoplay : false,// slideshow on / off
interval : 4000 // time between transitions
};
$.Slider.prototype = {
_init : function( options ) {
this.options = $.extend( true, {}, $.Slider.defaults, options );
this.$slides = this.$el.children('div.da-slide');
this.slidesCount = this.$slides.length;
this.current = this.options.current;
if( this.current < 0 || this.current >= this.slidesCount ) {
this.current = 0;
}
this.$slides.eq( this.current ).addClass( 'da-slide-current' );
var $navigation = $( '<nav class="da-dots"/>' );
for( var i = 0; i < this.slidesCount; ++i ) {
$navigation.append( '<span/>' );
}
$navigation.appendTo( this.$el );
this.$pages = this.$el.find('nav.da-dots > span');
this.$navNext = this.$el.find('span.da-arrows-next');
this.$navPrev = this.$el.find('span.da-arrows-prev');
this.isAnimating = false;
this.bgpositer = 0;
this.cssAnimations = Modernizr.cssanimations;
this.cssTransitions = Modernizr.csstransitions;
if( !this.cssAnimations || !this.cssAnimations ) {
this.$el.addClass( 'da-slider-fb' );
}
this._updatePage();
// load the events
this._loadEvents();
// slideshow
if( this.options.autoplay ) {
this._startSlideshow();
}
},
_navigate : function( page, dir ) {
var $current = this.$slides.eq( this.current ), $next, _self = this;
if( this.current === page || this.isAnimating ) return false;
this.isAnimating = true;
// check dir
var classTo, classFrom, d;
if( !dir ) {
( page > this.current ) ? d = 'next' : d = 'prev';
}
else {
d = dir;
}
if( this.cssAnimations && this.cssAnimations ) {
if( d === 'next' ) {
classTo = 'da-slide-toleft';
classFrom = 'da-slide-fromright';
++this.bgpositer;
}
else {
classTo = 'da-slide-toright';
classFrom = 'da-slide-fromleft';
--this.bgpositer;
}
this.$el.css( 'background-position' , this.bgpositer * this.options.bgincrement + '% 0%' );
}
this.current = page;
$next = this.$slides.eq( this.current );
if( this.cssAnimations && this.cssAnimations ) {
var rmClasses = 'da-slide-toleft da-slide-toright da-slide-fromleft da-slide-fromright';
$current.removeClass( rmClasses );
$next.removeClass( rmClasses );
$current.addClass( classTo );
$next.addClass( classFrom );
$current.removeClass( 'da-slide-current' );
$next.addClass( 'da-slide-current' );
}
// fallback
if( !this.cssAnimations || !this.cssAnimations ) {
$next.css( 'left', ( d === 'next' ) ? '100%' : '-100%' ).stop().animate( {
left : '0%'
}, 1000, function() {
_self.isAnimating = false;
});
$current.stop().animate( {
left : ( d === 'next' ) ? '-100%' : '100%'
}, 1000, function() {
$current.removeClass( 'da-slide-current' );
});
}
this._updatePage();
},
_updatePage : function() {
this.$pages.removeClass( 'da-dots-current' );
this.$pages.eq( this.current ).addClass( 'da-dots-current' );
},
_startSlideshow : function() {
var _self = this;
this.slideshow = setTimeout( function() {
var page = ( _self.current < _self.slidesCount - 1 ) ? page = _self.current + 1 : page = 0;
_self._navigate( page, 'next' );
if( _self.options.autoplay ) {
_self._startSlideshow();
}
}, this.options.interval );
},
page : function( idx ) {
if( idx >= this.slidesCount || idx < 0 ) {
return false;
}
if( this.options.autoplay ) {
clearTimeout( this.slideshow );
this.options.autoplay = false;
}
this._navigate( idx );
},
_loadEvents : function() {
var _self = this;
this.$pages.on( 'click.cslider', function( event ) {
_self.page( $(this).index() );
return false;
});
this.$navNext.on( 'click.cslider', function( event ) {
if( _self.options.autoplay ) {
clearTimeout( _self.slideshow );
_self.options.autoplay = false;
}
var page = ( _self.current < _self.slidesCount - 1 ) ? page = _self.current + 1 : page = 0;
_self._navigate( page, 'next' );
return false;
});
this.$navPrev.on( 'click.cslider', function( event ) {
if( _self.options.autoplay ) {
clearTimeout( _self.slideshow );
_self.options.autoplay = false;
}
var page = ( _self.current > 0 ) ? page = _self.current - 1 : page = _self.slidesCount - 1;
_self._navigate( page, 'prev' );
return false;
});
if( this.cssTransitions ) {
if( !this.options.bgincrement ) {
this.$el.on( 'webkitAnimationEnd.cslider animationend.cslider OAnimationEnd.cslider', function( event ) {
if( event.originalEvent.animationName === 'toRightAnim4' || event.originalEvent.animationName === 'toLeftAnim4' ) {
_self.isAnimating = false;
}
});
}
else {
this.$el.on( 'webkitTransitionEnd.cslider transitionend.cslider OTransitionEnd.cslider', function( event ) {
if( event.target.id === _self.$el.attr( 'id' ) )
_self.isAnimating = false;
});
}
}
}
};
var logError = function( message ) {
if ( this.console ) {
console.error( message );
}
};
$.fn.cslider = function( options ) {
if ( typeof options === 'string' ) {
var args = Array.prototype.slice.call( arguments, 1 );
this.each(function() {
var instance = $.data( this, 'cslider' );
if ( !instance ) {
logError( "cannot call methods on cslider prior to initialization; " +
"attempted to call method '" + options + "'" );
return;
}
if ( !$.isFunction( instance[options] ) || options.charAt(0) === "_" ) {
logError( "no such method '" + options + "' for cslider instance" );
return;
}
instance[ options ].apply( instance, args );
});
}
else {
this.each(function() {
var instance = $.data( this, 'cslider' );
if ( !instance ) {
$.data( this, 'cslider', new $.Slider( options, this ) );
}
});
}
return this;
};
})( jQuery );