Question

My html structure is like below

<h3><span class="mw-headline">Zone1</span></h3>
<ul>
<li>District 1 of Zone1</li>
<li>District 2 of Zone1</li>
<li>District 3 of Zone1</li>
</ul>
<h3><span class="mw-headline">Zone2</span></h3>
<ul>
<li>District 1 of Zone2</li>
<li>District 2 of Zone2</li>
<li>District 3 of Zone2</li>
</ul>

我需要在json上拉下所有区域和区域，如下所示

[
  {
    "zone": "Zone1",
    "districts": [
      "District 1 of Zone1",
      "District 2 of Zone1",
      "District 3 of Zone1"
    ]
  },
  {
    "zone": "Zone2",
    "districts": [
      "District 1 of Zone2",
      "District 2 of Zone2",
      "District 3 of Zone2"
    ]
  }
]

我的jquery如下所示

$('.mw-headline').each( function() {
    var state=$( this ).html();
    $(this).closest('ul').find('li').each(function()  { //i need the closest ul and iterate it
        alert($( this ).prop('tagName'));
    });

});

我需要找到最近的ul当前对象并迭代li，这样我就可以把它放在数组上。

但它不起作用..我想知道我错过了什么？

Answer 1

使用next的{{1}}选择parent。

ul

这适用于完整的问题

$(this).parent().next('ul').find('li').each(function(){...})

DEMO

Answer 2

您需要先找到它的父母：

$(this).parent().closest('ul')

更好的方法是使用prev或next：

 $(this).parent().next('ul') // to find next ul

或者，

$(this).parent().prev('ul') //to find previous ul

如何从当前element-jquery中找到最接近的UL标记

2 个答案: