孩子们()只选择第一个孩子

时间:2013-04-16 23:17:33

标签: jquery

鉴于以下无序列表:

<ul class="nb">
    <li class="home"><a href="index.html" class="current"><span class="displace">Home</span></a></li>
    <li class="products"><a href="products.html" title="Products"><span class="displace">Products</span></a></li>
    <li class="services"><a href="services.html" title="Services"><span class="displace">Services</span></a></li>
    <li class="support"><a href="support.html" title="Support"><span class="displace">Support</span></a></li>
    <li class="company"><a href="company.html" title="Company"><span class="displace">Company</span></a></li>
    <li class="contact"><a href="contact.html" title="Contact"><span class="displace">Contact</span></a></li>
</ul>

你能告诉我为什么以下只选择第一个列表项:

var status = 'closed';
$('ul.nb li a').click(function(e){
    e.preventDefault();
        if ($status == 'closed'){
            var li = $(this).closest('li');
            var items = li.parent().children();
            console.log(items.html());
        }
});

预期结果是所有列表项,控制台节目的选择 <a href="index.html" class="current"><span class="displace">Home</span></a>

TIA

3 个答案:

答案 0 :(得分:7)

html因为getter只返回第一个选定元素的html内容,代码中的items是包含所有选定li元素的jQuery包装数组。 http://jsfiddle.net/MKUGv/

答案 1 :(得分:1)

因为.html()没有遍历jQuery对象的每个元素并且连接了所有的html值。它只返回第一个html值。

由于li是所有孩子,你必须自己循环。类似的东西:

var html = '';
items.each(function(i, elm) {
    html += $(elm).html();
});

答案 2 :(得分:1)

我认为这就是你要找的......(记录每个li的html)

http://jsfiddle.net/Z2Rhx/

$(items).each(function() { console.log($(this).html()) });