Question

<div class="owl-stage">
   <div class="owl-item active">
      <div class="item">
        <div class="slider-image"></div>
    </div>
</div>
<div class="owl-item">
    <div class="item">
        <div class="slider-image"></div>
    </div>
</div>
<div class="owl-item">
    <div class="item">
        <div class="slider-image"></div>
    </div>
</div>
<div class="owl-item">
    <div class="item">
        <video src="dummy" controls=""></video>
    </div>
</div>

<a href="">Play Video</a>

当我点击播放视频按钮时，我想要带有视频标签的“猫头鹰项目”的索引，在这种情况下它应该是3！怎么样？

Answer 1

您可以使用此行data.p.relationships它会在您的案例$(".owl-stage .owl-item video").closest(".owl-item").index();中返回owl-item的索引

<强>演示

$("a").click(function(e) {
e.preventDefault()
  var index = $(".owl-stage .owl-item video").closest(".owl-item").index();
  console.log(index)
})

Answer 2

尝试jQuery .index()函数

有关详细信息，请参阅https://api.jquery.com/index/

您案例的示例代码：

   $(".owl-item").click(function(){
      var index = $(".owl-item").index(this);

       alert("Index:  "+index);
   });

提醒一下，索引是从零开始的。所以第一个将是0。

<强>更新

我看到您要点击该链接，而不是点击.owl-item。

在这种情况下，请使用以下代码：

$("a").click(function(){
      var index = $(".owl-item video").closest(".owl-item").index();

      alert("Index:  "+index);
});

Answer 3

您可以使用解决方案https://jsfiddle.net/emrsn3s3/1/

＆＃13;

$('a').click(function(e){
  e.preventDefault();
  console.log($('video').closest('div.owl-item').index());
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="owl-stage">
   <div class="owl-item active">
      <div class="item">
        <div class="slider-image"></div>
    </div>
</div>
<div class="owl-item">
    <div class="item">
        <div class="slider-image"></div>
    </div>
</div>
<div class="owl-item">
    <div class="item">
        <div class="slider-image"></div>
    </div>
</div>
<div class="owl-item">
    <div class="item">
        <video src="dummy" controls=""></video>
    </div>
</div>
<a href="">Play Video</a>

＆＃13;

希望这会对你有所帮助。

jQuery获取点击项目的索引

3 个答案: