【问题标题】:JQuery .each not looping through all elements with classJQuery .each 没有循环遍历所有具有类的元素
【发布时间】:2017-04-05 17:13:06
【问题描述】:

我正在为我的雇主使用的内容管理平台上托管的高度定制的页面开发导航解决方案。

我正在尝试构建一个函数,该函数遍历具有特定类的所有元素,读取数据存储值,然后将基于该值的外部资源加载到容器 div 中。

虽然该函数适用于第一个匹配项,但它会在该点停止 - 不会对文档的其余部分进行迭代。该函数本身在单独的 $(document).ready(function() 块中调用,因为我有几个函数在页面加载时运行。

编辑:由于玩不同的东西而导致过时的代码,下面的当前代码。

Javascript:

 function loadNavigation() {
 $('.topLevelNav').each(function () {
 var topLevelNavIndex = $(this).data('nav-index')+1;
 var topLevelNavItem = spaceMainContent + " table tr:nth-child(" + topLevelNavIndex + ") td:nth-child(2)";
 $(this).children().first().load(topLevelNavItem);
});
}

HTML:

<div class="topLevelNav" data-nav-index="1">Main
 <div>Container</div>
<div class="subLevelNav" data-nav-index ="3">Sub<div>Container</div></div>
<div class="subLevelNav" data-nav-index ="4">Sub<div>Container</div></div>
<div class="subLevelNav" data-nav-index ="5">Sub<div>Container</div></div>
<div class="subLevelNav" data-nav-index ="6">Sub<div>Container</div></div>
<div class="subLevelNav" data-nav-index ="2">Sub<div>Container</div></div>
</div>
<div class="topLevelNav" data-nav-index ="2">Main
<div>Container</div>
<div class="subLevelNav" data-nav-index ="3">Sub<div>Container</div></div>
<div class="subLevelNav" data-nav-index ="5">Sub<div>Container</div></div>
<div class="subLevelNav" data-nav-index ="2">Sub<div>Container</div></div>
</div>
<div class="topLevelNav" data-nav-index ="3">Main
<div>Container</div>
<div class="subLevelNav" data-nav-index ="2">Sub<div>Container</div></div>
</div>

我一生都无法弄清楚为什么在第一场比赛之后就停止了,但我也不是一个聪明人。有什么想法吗?

【问题讨论】:

  • 你的代码 $('.topLevelNav').each 应该遍历你所有的 .topLevelNav 元素,我只看到其中一个
  • 您实际上有多个topLevelNav-class div 还是所有其他topLevelNav2-class?
  • 您只定义了一个 .topLevelNav 类。
  • 另外,你想遍历子元素吗,如果是,你的选择器是错误的

标签: javascript jquery loops each


【解决方案1】:

如果你想处理 sublevelnavs,你的选择器是错误的。将其更改为任一

$('.topLevelNav .subLevelNav').each(function () {

如果你只想遍历顶层的 subLevelNavs

$('.subLevelNav').each(function () {

如果你想遍历每个子级导航

【讨论】:

    猜你喜欢
    • 2011-06-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-10-20
    • 2017-04-29
    • 2013-04-11
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多