Question

我有以下标记

<div id="search-query-autocomplete">
  <ul id="autocomplete-results">
    <li class="auto-li">blue</li>
  </ul>
</div>

并希望在用户按键时向第一个auto-li添加一个类。

我有以下javascript：

document.onkeydown = checkKey;
 function checkKey(e){
 e = e || window.event;

 if(e.keyCode=='40')
 {
   $('#autocomplete-results li:nth-child(0)').text('not working');
   console.log('here is 40'); //code
 }
}

但它不起作用 - 我需要改变什么？

事先提前

Answer 1

:nth-child伪类从索引1开始而不是0

第n个子伪类实际上无法帮助您选择第一个.auto-li，您可以使用:first，.eq(0)或:eq(0)将选择过滤为仅第一个.auto-li

$('#autocomplete-results li.auto-li').eq(0).text('working');

Answer 2

如果您想选择第一个auto-li，您的选择器应该是：

$('#autocomplete-results li.auto-li:first')

Answer 3

document.onkeydown = checkKey;
 function checkKey(e){
 e = e || window.event;



 if(e.keyCode===40)
 {    
     $('#autocomplete-results li:nth-child(1)').text('not working');
   alert('here is 40'); //code
 }
}

Nth-child索引以索引1开头，而不是标准列表索引0。

并且不要与=='40'进行比较而使用=== 40进行比较，因此没有不必要的类型转换（但是这与你的代码的纠正无关）。

用于特定li的jQuery选择器

3 个答案: