设置下一个和上一个HREF

Question

我正面临一些问题覆盖屏幕将打开，我必须在其中显示PDF文件，现在我使用的是touchpdf插件，我想要的是，覆盖屏幕上的箭头按钮将导航到下一个PDF文件并在覆盖屏幕上显示。我正在难以实现此目的谢谢所有

这是如何渲染图像的

<div class="col-lg-3 col-md-4 col-xs-6 thumb">
    <div class="image-div-conents">
       <h3 class="circle">BI</h3>
           <div  class="doc-name-date">
                  <!-- <ul class="list-inline"> -->
                       <span class="bill">Bill</span>
                           <span  class="bill">2-02-2017</span>
                            <!-- </ul> -->
                            </div>
                        </div>
                            <a  href="#">
                                <img  height="300px" class="img-responsive" src="http://i156.photobucket.com/albums/t20/warjhenz/1000x1000.gif" alt="">
                                <div class="validitity"><span>Validitity: Forever</span></div>
                            </a>
                    </div>

<div class="col-lg-3 col-md-4 col-xs-6 thumb">
    <div class="image-div-conents">
       <h3 class="circle">BI</h3>
           <div  class="doc-name-date">
                  <!-- <ul class="list-inline"> -->
                       <span class="bill">Bill</span>
                           <span  class="bill">2-02-2017</span>
                            <!-- </ul> -->
                            </div>
                        </div>
                            <a  href="#">
                                <img  height="300px" class="img-responsive" src="http://i156.photobucket.com/albums/t20/warjhenz/1000x1000.gif" alt="">
                                <div class="validitity"><span>Validitity: Forever</span></div>
                            </a>
                    </div>

这将继续，并将图像水平渲染

我尝试的是 -

添加点击事件

$('.thumb a').on('click',function(){
 alert($(this).attr('href'));
 alert($(this).index());
});

，但每个HREF总是1个索引，因为有Seprate Div，其中只有锚固标签。

Answer 1

您需要创建一个具有所有divs的最上方的父元素您可以创建DIV

<div class="parent> all your divs etc </div>

$('.thumb a').on('click',function(){
 alert($(this).parentsUntil("thumb").index()); //Here the index will be the clicked index. 
});

Answer 2

问题是您正在使用

<a href="#"></a>

问题是单击事件在 a tag上， #占据了页面的顶部。您应始终使用 javascript:void(0)。

<a href="javascript:void(0)"></a>