jQuery委托优化
优化以下使用委托()的片段的最佳方式是什么?jQuery委托优化
jQuery('.menu').delegate('li.gallery', 'hover', function() { jQuery(this).children('.submenu').toggleClass('hide show'); });
jQuery('.menu').delegate('li.interior', 'hover', function() { jQuery(this).children('.submenu').toggleClass('hide show'); });
jQuery('.menu').delegate('li.exterior', 'hover', function() { jQuery(this).children('.submenu').toggleClass('hide show'); });
<li class="gallery">
<span>gallery</span>
<ul class="submenu hide">
<li class="interior">
<a href="/gallery/interior">Interior</a>
<ul class="submenu hide">
<li><a href="/gallery/interior?gallery=master-bedroom">Master Bedroom</a></li>
<li><a href="/gallery/interior?gallery=living-room">Living Room</a></li>
<li><a href="/gallery/interior?gallery=dining-room">Dining Room</a></li>
<li><a href="/gallery/interior?gallery=kitchen">Kitchen</a></li>
<li><a href="/gallery/interior?gallery=bathroom">Bathroom</a></li>
<li><a href="/gallery/interior?gallery=foyer">Foyer</a></li>
<li><a href="/gallery/interior?gallery=study">Study</a></li>
<li><a href="/gallery/interior?gallery=sunroom">Sunroom</a></li>
<li><a href="/gallery/interior?gallery=guest-room">Guest Room</a></li>
</ul>
</li>
<li class="exterior">
<a href="/gallery/exterior">Exterior</a>
<ul class="submenu hide">
<li><a href="/gallery/exterior?gallery=landscapes">Landscape</a></li>
<li><a href="/gallery/exterior?gallery=gardens">Gardens</a></li>
<li><a href="/gallery/exterior?gallery=cottages">Cottages</a></li>
<li><a href="/gallery/exterior?gallery=entry-driveway">Entry/Driveway</a></li>
</ul>
</li>
</ul>
</li>
您可以在.delegate()
选择参数使用multiple selector (,
)。
然而,由于what I would consider a bug in how .delegate()
works(关mouseover
/mouseout
,进入一个孩子时触发),我会避开它,它现在和直接绑定,就像这样:
jQuery('.menu').find('li.gallery, li.interior, li.exterior').hover(function() {
jQuery(this).children('.submenu').toggleClass('hide show');
});
我也这么认为,但是当我把鼠标悬停在子菜单上时,第一个触发器再次触发。我在上面添加了标记。 – 2010-10-19 19:11:14
@matt - 您使用的是哪个版本的jQuery?直到最近,“悬停”才被正确添加。 – 2010-10-19 19:14:06
@nick 1.4.2,我认为与代表的唯一版本。 – 2010-10-19 19:15:11
你有什么优化?可读性?速度?可扩展性? – 2010-10-19 19:06:51
可读性和速度。无意缩放。 – 2010-10-19 19:13:44
包括'.menu'将是一个开始。 – 2010-10-19 19:20:58