Jquery如何针对列表中的特定更改触发偶数条件

问题描述 投票:0回答:1

我有一个项目列表,可以通过单击将其删除。

仅当列表中有一项时,我才需要第一项成为突出显示。我已经尝试通过点击事件做到这一点。 但是,如果没有.click(),是否可以做到这一点?原因是此列表正在与其他列表动态交互,该列表项可能会被其他功能更改。

<ul id="container">
<li>1</li>
<li class="fixed">2</li>
<li>3</li>
<li class="fixed">4</li>
<li>5</li>
</ul>

$('#container').delegate('li', 'click', function() {
  $(this).remove();
});


$('#container').click(function(){
  if ($('#container').children().length == 1) {
    $("#container li:first-child" ).css( "background-color", "#fff2ac" );
  }
}

javascript jquery html css
1个回答
0
投票

您可以仅使用CSS并执行一条规则来检查li是否既是:first-child又是:last-child-

.container li:first-child:last-child {
  background-color: red;
}
<h5>List With Many Items</h5>
<ul class="container">
  <li>1</li>
  <li class="fixed">2</li>
  <li>3</li>
  <li class="fixed">4</li>
  <li>5</li>
</ul>

<h5>List With One Item</h5>
<ul class="container">
  <li>1</li>
</ul>


<h5>List With Two Items</h5>
<ul class="container">
  <li>1</li>
  <li class="fixed">2</li>
</ul>
© www.soinside.com 2019 - 2024. All rights reserved.