Question

这是我的代码。我想要做的是在第一个li项中添加一个“特色”类，它被添加到这个UL但是，当我尝试这个代码时，它不起作用，它总是将类添加到插入的每个li中，而我想要仅当ul中没有li且添加到此UL的第一个li元素时才添加的类。

我的代码：

$(".img_add").click(function(event){
    event.preventDefault();
    $('input:submit, p.upload-result').hide(); // hide submit button + results while working
    $(this).parent().after('<p class="loading"><img src="<?php bloginfo('template_directory'); ?>/img/loading_2.gif" alt="" /></p>');
    var path_img = $("#img_url").val();
    var count_images_lib = $(".upload-images-lib").length;
    $.ajax({
        url: '<?php bloginfo('template_directory'); ?>/ajax/add_image_url.php',
        type: 'POST',
        data: { path : path_img },
        dataType: 'json',
        success: function(data){
            $('.loading').remove();
            $('input:submit').show();
            if (data.status) {
                $('.upload-images-lib').prepend(data.message);
                if (count_images_lib == 1) {
                    $('.upload-images-lib li:first-child').addClass('featured');
                }
                alert(count_images_lib);
                $('p.upload-result').fadeIn(500).html('<span class="success"><?php _e('Your image has been added successfully.','sofa'); ?></span>');
            } else {
                $('p.upload-result').fadeIn(500).html('<span class="error">' + data.message + '</span>');
            }
        }
    });
});

我想要的是将类添加到第一个加载的li中。 请注意：data.message实际上是html格式的列表项。

问题是count_images_lib总是返回1，因此每次都会添加我的类。它不是第一个/最后一个选择器。

Answer 1

你试过这个吗..

$('.upload-images-lib li:first').addClass('featured');

Answer 2

您可能正在寻找.first（）函数。

Answer 3

由于您正在进行前置操作，我假设加载的第一个项目将位于列表的底部。因此，使用:last选择器获取最后一个项目（首次加载）并为其提供类。

$('.upload-images-lib li:last').addClass('featured')

如何将特定类添加到通过ajax加载的附加LI？

3 个答案: