为什么这个 ":lt" 在 jquery 中不起作用？

Question

我已经计算出最后一个 p 的索引，使用 $('p:lt(_index)') 它不起作用。当我用数字替换它时，它起作用了。为什么？

$(function() {
  var _index = $('p:last').index();
  console.log(_index);
  $('p:lt(_index)').css('color', 'red');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div>
  <p>1</p>
  <p>12</p>
  <p>123</p>
  <p>1234</p>
  <p>12345</p>
  <p>123456</p>
  <p>1234567</p>
  <p>12345678</p>
  <p>123456789</p>
</div>

Answer 1

您正在使用字符串 '_index' 作为 :lt() pseudo-class 的参数，而不是使用变量的值。该行：

$('p:lt(_index)').css('color','red');

应该是：

$('p:lt(' + _index + ')').css('color','red');

$(function() {
  var _index = $('p:last').index();
  console.log(_index);
  $('p:lt(' + _index + ')').css('color', 'red');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div>
  <p>1</p>
  <p>12</p>
  <p>123</p>
  <p>1234</p>
  <p>12345</p>
  <p>123456</p>
  <p>1234567</p>
  <p>12345678</p>
  <p>123456789</p>
</div>

为什么这个 ":lt" 在 jquery 中不起作用？

Why does this ":lt" not work in jquery?

javascript

jquery

jquery-selectors