JQuery .index() issue

Question

我有以下代码位的问题。我试图检索当前正在悬停的li元素的索引。

HTML:

<div id="featured">
         <ul>
              <li class="active">foo</li>
              <li class="">bar</li>
              <li class="">giraffe</li>
         </ul>
    </div>

JavaScript:

$(document).ready(function () {
        $('#featured ul li').hover(function(){
             console.log($(this).index()); //returns -1
             console.log($('li').index($(this))); //returns integers beginning at 6
        });
    });

我在javascript中使用的第一个选项返回-1，第二个返回从6开始的整数。

我迷路了。拜托谁告诉我我哪里做错了!:)

另外，我正在使用嵌入在drupal安装中的jQuery版本1.2.6

编辑:修正了我的JS示例的第二个console.log的语法。

Answer 1

问题是你的jquery版本，我用1.2.6,1.3.2测试了它，它像你说的那样工作，我用jquery 1.4.4测试了它，它正在工作。您是否考虑过升级jquery版本或加载新版本并使用noConflict()?

编辑-你可以使用这个作为一个解决方案:

    $('#featured ul li').hover(function(event){
         console.log($(this).prevAll('li').length); //returns 0,1,2
   });

小提琴(测试IE9, FF5和Chrome 12): http://jsfiddle.net/WWw4n/

Answer 2

我觉得你的语法不对。在这里工作:http://jsfiddle.net/rkw79/4NA3T/

$(document).ready(function () {
        $('#featured ul li').hover(function(){
             alert($(this).index()); //returns -1
             alert(('li').index($(this))); //returns integers beginning at 6
        });
    });

你能给我解释一下第二个警报的语法吗?为什么它不需要$符号呢?(jQuery新功能)

Answer 3

你需要这样的东西;

 $('#featured li').index($(this));

Answer 4

解决方案:

升级jquery: <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.min.js"></script>

很多网站使用最新版本1.6.2，这是托管在谷歌CDN，很可能很多人谁访问将有缓存…如果不是……不管它是什么，一个小文件…使用最新的版本可以省去很多麻烦。