jQuery嵌套.each答案

【问题标题】：jquery nested .eachjQuery嵌套.each
【发布时间】：2012-08-15 20:43:09
【问题描述】：

$(".globalTabs").each(function(){
    var $globalTabs = $(this);
    var parent = $globalTabs.parent('form');

    //initiate jQuery UI tabs
    $globalTabs.tabs();

    var ATBwidth = $globalTabs.parent().outerWidth();
    var tabsWidth = 0;

    //get total width of all li/tabs
    $(".globalTabs .ui-tabs-nav li").each(function() {
     tabsWidth += $(this).outerWidth();
    });


    if(tabsWidth >= ATBwidth){
       //doing something here
    }


});

由于嵌套的 .each 而导致中断 - 有没有解决此问题的简单方法？

第二个循环之后的中断 = 功能，它引用 $globalTabs 不再触发，因为它是未定义的。

愚蠢的错误：

在第二个循环之后，在本节中我提到了两次选择器。

所以，$(".globalTabs").each(function(){ 这当然行不通： $globalTabs.find(".globalTabs .ui-tabs-nav li").hide();

与循环无关。

感谢大家的帮助。

【问题讨论】：

你是什么意思，“正在打破”？

标签： jquery loops for-loop foreach each

【解决方案1】：

而不是使用this 的值传递来自.each(index, value) 的值

$(".globalTabs").each(function(index, value){
    var $globalTabs = $(value);
    var parent = $globalTabs.parent('form');

    //initiate jQuery UI tabs
    $globalTabs.tabs();

    var ATBwidth = $globalTabs.parent().outerWidth();
    var tabsWidth = 0;

    //get total width of all li/tabs
    $(".globalTabs .ui-tabs-nav li").each(function(index, secondValue) {
     tabsWidth += $(secondValue).outerWidth();
    });


    if(tabsWidth >= ATBwidth){
       //doing something here
    }


});

【讨论】：

如果您给每对回调参数赋予相同的名称，则无助于澄清任何事情。 :-)
需要`tabsWidth += $(secondValue).outerWidth();
@Jason 更改为：$(secondValue)
第二次循环后仍然中断
@Jason 您能否编辑您的问题以定义“中断”的含义，目前尚不清楚。

【解决方案2】：

也许您的多个 this 变量感到困惑？尝试在回调函数中使用参数（http://api.jquery.com/each/）：

$(".globalTabs").each(function(i,tab){
    var $globalTabs = $(tab);

// ...

$(".globalTabs .ui-tabs-nav li").each(function(j,myli) {
    tabsWidth += $(myli).outerWidth();
});

【讨论】：