Question

我在向每个列表元素添加类时遇到问题。这是示例html：

<ul id="main_list">
    <li>item1</li>
    <li>item2<li>
<ul>

我的jquery代码，我不明白为什么它不像我期望的那样工作：

   $(function(){
        $('#main_list').children().each(function(){
            $(this).addClass(function(){
                return $(this).index()})
            })
          })

Answer 1

这是因为你正在调用的{jQuery对象addClass中只有一个项目（你通过$(this)创建了这个jQuery对象）。试试这个：

$("#main_list > li").addClass(function() {
    return $(this).index();
});

...如果您真的想要分配0，1等类，我想我可能会在这些数字前加上一些东西;我不能立即在规范中找到它，但我不认为类名可以以数字开头。所以：

$("#main_list > li").addClass(function() {
    return 'n' + $(this).index();
});

...适用于n0，n1等

Answer 2

制作有效的班级名称（不能以数字开头）：

$("#main_list li").addClass(function() {
    return("myItem" + $(this).index());
});

但是，听起来我觉得你可能宁愿设置一个id：

$("#main_list li").attr("id" function() {
    return("myItem" + $(this).index());
});

看着Cris'（原始海报）对其他答案的评论，听起来你想做的就是能够在以后某个时候从对象中提取有序位置。将数据属性放在代表它的顺序的对象上可能更容易：

// put an attribute on each object that represents it's index so that's easier to get later
$("#main_list li").each(function(index){
    $(this).data("pos", index);
});

然后，您可以使用以下方法访问该数据值：

item.data("pos");

这对我来说似乎比解析你没有其他用途的类名中的数字要清晰得多。

此处示例：http://jsfiddle.net/jfriend00/RDvw2/。

Answer 3

我假设您正在尝试根据他们在ul中的位置对li进行编号？

function addClasses( )
{
    $( '#main_list' ).children( ).each( function( index )
    {
        $( this ).addClass( 'myClass' + index );
    } );
}

编辑：正如jfriend00所指出的，类名不能以数字开头。

向每个子节点添加类的问题

3 个答案: