学习了下别人写的一个tab切换插件,对this和$(this)不是很懂,那位高手指点下:jQuery.fn.Tabs = function() {
return this.each(function() {
x = $(this);
var targets = x.children("div").addClass("tabsdiv").hide();
x.children(".tabsul").children("li").each(function(i) {
this.target = targets[i];
$(this).click(function() {
if ($(this).is(".on")) return; y = $(this).siblings(".on");
y.add(this).toggleClass("on"); $(this.target).add(y.size() > 0 ? y[0].target : null).toggle();
//$(this.target).show().siblings().hide()
});
}).eq(0).click();
});
};
return this.each(function() {
x = $(this);
var targets = x.children("div").addClass("tabsdiv").hide();
x.children(".tabsul").children("li").each(function(i) {
this.target = targets[i];
$(this).click(function() {
if ($(this).is(".on")) return; y = $(this).siblings(".on");
y.add(this).toggleClass("on"); $(this.target).add(y.size() > 0 ? y[0].target : null).toggle();
//$(this.target).show().siblings().hide()
});
}).eq(0).click();
});
};
x = $(this);这里的this是选择器里选择了的元素的dom对象,以为each方法会循环已选择的元素然后调用参数传进来的方法。
jQuery.each = function( object, callback, args ) {
if ( args ) {
if ( object.length == undefined ) {
for ( var name in object )
if ( callback.apply( object[ name ], args ) === false )
break;
} else
for ( var i = 0, length = object.length; i < length; i++ )
if ( callback.apply( object[ i ], args ) === false )
break;} else {
if ( object.length == undefined ) {
for ( var name in object )
if ( callback.call( object[ name ], name, object[ name ] ) === false )
break;
} else // 大多数都是以下else这种情况,callback有2个参数第一个为所在的位置,第2个为dom对象
for ( var i = 0, length = object.length, value = object[0];
i < length && callback.call( value, i, value ) !== false; value = object[++i] ){}
} callback.apply( object[ i ], args )
$(this)则是JQuery对象