javascript - 如何将文本添加到跨度 jQuery

Question

我有这个用于创建动态菜单的 jQuery 代码

function createList(test){
      alert(test);
        $('#nav')
        .append('<li class="top"><a href="nogo2" id="products" class="top_link"><span class="down"></span></a></li>');
        $('.down').text(test);
    }

我遇到的问题是当我尝试将文本添加到跨度时

$('.down').text(test);

菜单更改为最后一个值，例如，如果我的值是 abcde，那么我所有的菜单 eeeee 任何人都可以帮助我，谢谢

Answer 1

您可以尝试使用它来仅选择最后一个 .down 而不是全部：

$('.down:last').text(test);

Answer 2

选择器$('.down')选择该类的每个元素down

如果你想选择最后创建的.down使用这个：

$('.down:last').text(test);

Answer 3

你为什么不直接这样做：

 function createList(test) {
     alert(test);
     $('#nav')
         .append('<li class="top"><a href="nogo2" id="products" class="top_link"><span class="down">' + test + '</span></a></li>');
 }

Answer 4

$('.down').each(function(){
    $(this).text(test);
});

Answer 5

我假设您为每个菜单项多次调用 createList()，但此函数创建一组 li，其具有相同的类，称为“down”。然后，您正在修改类（即所有具有“down”类的 li）。您想要的是为每个 li 分配一个唯一的 id。

这是小提琴解决方案：http:
//jsfiddle.net/acturbo/vZAee/2/

这应该工作：

function createList(test){
      //alert(test);
    var id = "product-" + test;
    console.log(test)

        $('#nav')
        .append('<li class="top"><a href="nogo2" id="products" class="top_link"><span id="'+ id +'"></span></a></li>');
        $("#"+id).text(test);
    }


$().ready(function() {
    createList( "a");    
    createList( "b");   
    createList( "c");   
});