jquery如何使用display:none获取第一个列表项

Ano*_*use 1 html jquery

好的,所以我有这个包含ul的div:

    <html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" ></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function(){
    alert($('#slider ul li[display="none"]:first').text());
  });
});
</script>
<style type="text/css">
li
{
display:inline;
margin: 20px;
}
</style>
</head>
<body>
<div id="slider" style="width:100%; overflow-x:hidden"><ul><li style="display:none">Steve 1</li><li style="display:none">Frank</li><li>Tim</li><li>Steve</li><li>Frank</li><li>Tim</li><li>Steve</li><li>Frank</li><li>Tim</li><li>Steve</li><li>Frank</li><li>Tim</li><li>Steve</li><li>Frank</li><li>Tim</li><li>Steve</li><li>Frank</li><li>Tim</li><ul>
</div>
<button type="button" style="float:left">Previous</button><div style="float:right">Next</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

我想要发生的是,当你按下上一个按钮时,它会找到列表中的第一个项目,显示无,并显示带有它的内容的消息.在这种情况下Steve1.

所以我使用了$('#slider ul li[display="none"]:first')这意味着它应该找到名为slider的div,它是ul中的第一个列表项,显示:none.

我在邮件中得到了一个空白.

任何人都知道我做错了什么.

我认为这与我构建的属性部分有关:

http://api.jquery.com/attribute-equals-selector/

And*_*ong 8

$('#slider ul li:hidden:first') 是你在找什么

http://api.jquery.com/hidden-selector/

:hidden 根据上面的链接,符合以下条件

元素可被视为隐藏,原因如下:

  1. 它们的CSS显示值为none.
  2. 它们是type ="hidden"的表单元素.
  3. 它们的宽度和高度显式设置为0.
  4. 隐藏了一个祖先元素,因此该元素不会显示在页面上.