jquery - jqueryはホバーされたliのインデックスを取得します

Question

私がやりたいのは、ホバーされたiのインデックスを返すことだけです。ulにはクラスがあります。

これはうまくいくようです

$('.around li').on("mouseover", function(event){
var myindex =  $('.around').index(this);
console.log(myindex);
})

Answer 1

これはどう：

$('.around li').on("mouseover", function(event){
var myindex =  $(this).index();
console.log(myindex);
})

Answer 2

多分あなたはこれをやろうとしている：

var li = $('.around li');
li.on("mouseover", function(){
   var myindex = li.index(this);
   console.log(myindex);
})

フィドルの例：http：//jsfiddle.net/MKExb/

Answer 3

あなたはこのようなものを書くことができます：

var listItem = document.getElementById('bar');
alert('Index: ' + $('li').index(listItem));

HTH

Answer 4

あなたはこれを使うことができます

<script type="text/javascript">

      $(document).ready(function () {
            $('.around li').each(function () {
                $(this).bind('mouseover', null, function () {
                    var index = $('.around li').index(this);
                    console.log(index);
                });

            }, function () { });

        });

</script>

またははるかにきれいなもの

 <script type="text/javascript">
    $(document).ready(function () {
        $('.around li').hover(function () {
            var index = $('.around li').index(this);
            console.log(index);
        }, function () { });

    }); 
    </script>

Answer 5

受け入れられた答えは、パフォーマンスに関しては悪いです。クエリをキャッシュし、デリゲートを使用する方がはるかに優れています。これにより、ulに1つのハンドラーのみが設定され、すべてのイベントがマウスのあるliに委任されます。私は元のjsfiddleを変更し、外観を持ち、魅力のように機能し、コードはさらに長くはありません。

http://jsfiddle.net/zhkjLoet/1/

var ul = $('.around'); // cache query
ul.on("mouseover","li", function(event){ //delegate events to li child
   var myindex = $(this).index();
   console.log(myindex);
})