javascript - 对将函数应用于所有 li 项目感到困惑

Question

这可能是一个愚蠢的问题。我在网站上寻找答案，但可能搜索不正确。

<ul>
   <li id="tab1">1</li>
   <li id="tab2">2</li>
   <li id="tab3">3</li>
</ul>

我正在尝试编写代码，让选项卡在单击时淡出li。有没有一种方法可以一次性编写代码并将其应用于所有 3 个 li。我不确定我的方向是否正确。我想我需要使用“if 语句”，这就是我到目前为止所拥有的......

(function() {
    var lists = $("ul li");

      for(var i = 0; i < items.length; i++)
    {    
         buttons[i].onclick=(function(){      
         var n = i,
         tabs = $("#tab");  

       return function(){
        tabs + n.click.fadeOut(500) })

         })
    }
})

我知道这远远不正确，但我完全被难住了。有没有更好的方法来做到这一点。感谢您的帮助

Answer 1

我不确定您的代码正在尝试执行什么操作，但这将使单击时的项目​​淡出。根据名称，我假设您正在尝试淡出相应的选项卡 - 向我显示该选项卡 html，我将更新此答案。

$("ul").on("click", "li", function() {
   //guess on fading the tab:
   $("#tabs div").not("." + this.id).fadeOut(500);//fadeout other tabs
   $("#tabs ." + this.id).fadeIn(500); //fade in this tab
})

如果您的选项卡 html 如下所示，这将淡出所有选项卡并淡入单击的选项卡:

<div id="tabs">
    <div class="tab1">1</div>
    <div class="tab2">2</div>
    <div class="tab3">3</div>
</div>