0

我有两个清单。一个无序列表和一组充当列表的 div。无序列表有 4 个列表项，也有 4 个 div。

我想要实现的是从每个 div 复制标题并将其放在每个列表项中。换句话说，第一个 div 的标题应该对应于第一个列表项的标题。

到目前为止，我所能实现的只是循环遍历 div 并提醒我要复制的标题，如下所示，但我不知道如何继续。

<div class="container">
    <div class="nav-list">
        <ul>
            <li>1</li>
            <li>2</li>
            <li>3</li>
            <li>4</li>
        </ul>
     </div>
    <div class="tab-list">
        <div class="tab-item">
            <h3>To be copied</h3>
        </div>
        <div class="tab-item">
            <h3>To be copied</h3>
        </div>
        <div class="tab-item">
            <h3>To be copied</h3>
        </div>
        <div class="tab-item">
            <h3>To be copied</h3>
        </div>
    </div>
</div>


$('.tab-list .tab-item').each(function(index) {
    alert(index + ': ' + $(this).children('h3').text());
});
4

4 回答 4

1

尝试这个：

$('.tab-list .tab-item').each(function(index) {
    $('.nav-list').children('ul').children().eq(index).html($(this).children('h3').text());
});
于 2012-05-10T09:10:49.980 回答
0

尝试这个：

$('.tab-list .tab-item').find('h3').each(function(index) {
    that = $(this).text();
    $('li').eq(index).text(that + $('li').eq(index).text())
});

http://jsfiddle.net/kuFDT/3/

您还可以克隆h3标签而不是复制它们的文本：

$('.tab-list .tab-item').find('h3').each(function(index) {
    that = $(this).clone();
    $('li').eq(index).before(that)
});

http://jsfiddle.net/kuFDT/14/

于 2012-05-10T09:13:06.470 回答
0

这个小提琴应该可以解决问题：http: //jsfiddle.net/pndCd/

于 2012-05-10T09:09:51.003 回答
0

尝试这个：

var list = $('.nav-list li');
$('.tab-list .tab-item').each(function(i) {
    list.eq(i).text($(this).find('h3').text())
});

见http://jsfiddle.net/EDpM7/

于 2012-05-10T09:09:58.540 回答