什麼類型的元素,我使用下面的模塊來顯示一個子菜單:如何判斷事件被觸發的
icisSite.fatNav = function(trigger){
function init() {
width = 0,
$mainMenuListEl = $('.nav-SiteNav .nav-list > li'),
$subNav = $('.subNav > li > ul');
appendSubNav();
getWidth();
};
function appendSubNav(){
$subNav.each(function(index){
index = ++index;
$(this).appendTo($mainMenuListEl[index]);
});
};
function subNavShow(trigger){
setWidth(trigger);
trigger.toggleClass('hover');
};
function subNavHide(trigger){
trigger.toggleClass('hover');
trigger
.find('ul')
.removeAttr('style');
};
function getWidth(){
$mainMenuListEl.each(function(index){
width += parseInt($(this).outerWidth());
});
width = width - 11;
};
function setWidth(trigger){
trigger
.find('ul')
.css({'width': width});
};
return {
setup: init,
show: subNavShow,
hide: subNavHide
};
}();
icisSite.fatNav.setup();
$('.nav-SiteNav .nav-list > li:gt(0)').hover(function() {
$this = $(this);
icisSite.fatNav.show($this);
},function(e) {
icisSite.fatNav.hide($this);
});
$('.nav-SiteNav .nav-list > li:gt(0) a').focusin(function() {
var $this = $(this);
$this
.parent()
.toggleClass('hover');
$this
.parent()
.find('ul')
.css({'width': icisSite.width});
});
$('.nav-SiteNav .nav-list > li:gt(0) a').focusout(function() {
var $this = $(this);
$this
.parent()
.toggleClass('hover');
$this
.parent()
.find('ul')
.removeAttr('style');
});
我想重構,以適應的focusIn和focusOut事件。由於代碼與懸停事件非常相似,但並不相同。
我不確定如何做到這一點,而不是檢查「觸發」的元素類型,並想知道是否有更好的方法?
我甚至不知道如何檢索元素的類型嗎?所以如果是懸停,它會返回一個li元素和一個焦點錨元素。
謝謝。認爲我在某種程度上過度複雜化了這個問題。 – RyanP13 2011-04-01 10:58:24