目标在jQuery中的多个类（this）？

我已经建立了一个简单的下拉菜单来代替某些HTML选择菜单，如下所示：目标在jQuery中的多个类（this）？

$('html, .currentPage').click(function() { 
    $('.currentMenu').slideUp('fast'); 
}); 

$('.currentPage').click(function(e){   
    if(!$(this).next().is(":visible")) { 
     $(this).next().stop().slideDown('fast'); 
    } 
    e.stopPropagation(); 
}); 

$(".currentMenu li").click(function(e){ 
    e.preventDefault(); 
    $(".currentPage").html($(this).text()); 
});

但是，如果我有一个以上的菜单，最后一部分：

$(".currentMenu li").click(function(e){ 
    e.preventDefault(); 
    $(".currentPage").html($(this).text()); 
});

会出现在两个菜单上。我如何才能只针对该特定菜单的“.currentPage”类？

HTML：

     <div class="menuWrap font"> 
          <div class="currentPage">Trebuchet MS</div> 
          <div class="currentMenu"> 
           <ul> 
           <li>Arial</li> 
           <li>Helvetica</li> 
           <li>Droid Sans</li> 
           <li>Trebuchet MS</li> 
           <li>Georgia</li> 
           <li>Droid Serif</li> 
           </ul> 
          </div> 
         </div> 


         <div class="menuWrap fontSize"> 
          <div class="currentPage">12pt</div> 
          <div class="currentMenu"> 
           <ul> 
           <li>9pt</li> 
           <li>10pt</li> 
           <li>11pt</li> 
           <li>12pt</li> 
           <li>13pt</li> 
           </ul> 
          </div> 
         </div>

来源

2012-02-28 tctc91

。我已经更新了我的答案，因为您已经发布了您的HTML。 – 2012-02-28 13:07:32

你有两个选择。第一种是遍历DOM以从.currentMenu li中找到最近的.currentPage元素。鉴于你的HTML结构，这应该工作：

$(".currentMenu li").click(function(e){ 
    e.preventDefault(); 
    $(this).closest(".currentMenu").prev().html($(this).text()); 
});

第二个选项是把这个代码到你申请一个元素的插件，让你随时知道这在选择元素上下文

来源

2012-02-28 12:59:24

@HackedByChinese提供了最简单的解决方案，但您提供了更好的解决方案。无论是通过jQuery插件还是实例化类，都应该在这里完成某种封装。但是，在这一点上，这可能会让OP有点进步。 – maxedison 2012-02-28 13:01:57

优秀。总是最能吸引我的东西。谢谢！ – tctc91 2012-02-28 13:08:04

OK，根据您的更新问题。 .currentMenu和.currentPage是兄弟姐妹。所以你可以导航到父元素，然后深入到当前页面。这里有一个小提琴：http://jsfiddle.net/DuPuJ/

来源

2012-02-28 12:58:46 HackedByChinese

嗯，它似乎没有回应这种变化？你介意把它发布在JS小提琴上吗？谢谢 – tctc91 2012-02-28 13:05:26

好的，这改变了一点。以下是样本更新的答案。 – HackedByChinese 2012-02-28 13:14:34

目标在jQuery中的多个类（this）？

回答

相关问题