使用Jquery将函数直接定向到类的单个实例

我有一系列的

，它们与系统自动生成的类相同。它们对它没有ID值。我正在尝试更改类的单个实例的属性

这是HTML

<div class = 'test'>
  <ul>
     <li>something</li>
     <li>something</li>
     <li>something</li>
     <li>something</li>
  </ul>
</div>
<div class = 'test'>
  <ul>
     <li>something</li>
     <li>something</li>
  </ul>
</div>

我无法使函数直接作用于类对象的单个实例

您可以尝试以下方法：

var h = $('.test').find('li:eq(0)').height();

$('.test').css({'height': h, 'overflow' : 'hidden'});

$(document).on('click', '.test', function(){ // delegate the event
    if($(this).css('overflow') === 'hidden'){
        $(this).removeAttr('style');
    }else{
        $(this).css({'height': h, 'overflow' : 'hidden'});
    }
});

---

您需要有一个事件委派，因为正如您提到的，它是系统生成的，我已委派给

$（文档）

，但您可以委派给元素，该元素在页面首次加载时可用，就像

的父元素一样。test

您可以使用

而不是（：第一个子元素）

选择器以获取非第一个子元素的

li

元素

$('li:not(:first-child)').hide();

$('.test').click(function(){
    var $this = $(this),
        list = $this.find('li:not(:first-child)');
    $this.data('collapsed', !$this.data('collapsed'));
    $this.data('collapsed') ? list.fadeIn() : list.fadeOut();
});

试试这个：

$('.test').each(function() {
    $(this).find('li').hide().eq(0).show();
});
$('.test').click(function() {
    $(this).find('li').show();
});

---

是啊！我比我更喜欢这个策略。尽管如此，我仍然认为必须有事件委托，正如OP提到的，我有一系列的具有相同类的由系统自动生成的…。不确定，但我认为应该有。很好的一个，这足以让我更进一步。谢谢

$('.test').each(function() {
    $(this).find('li').hide().eq(0).show();
});
$('.test').click(function() {
    $(this).find('li').show();
});