Question

我有以下HTML结构：

    <div class="swiper-container2">
                        <div class="swiper-wrapper">

                            <div class="swiper-slide"><h3>January</h3></div>
                            <div class="swiper-slide"><h3>February</h3></div>
                            <div class="swiper-slide"><h3>March</h3></div>
                            <div class="swiper-slide"><h3>April</h3></div>
                            <div class="swiper-slide"><h3>May</h3></div>
                            <div class="swiper-slide"><h3>June</h3></div>
                            <div class="swiper-slide"><h3>July</h3></div>
                            <div class="swiper-slide"><h3>August</h3></div>
                            <div class="swiper-slide"><h3>September</h3></div>
                            <div class="swiper-slide"><h3>October</h3></div>
                            <div class="swiper-slide"><h3>November</h3></div>
                            <div class="swiper-slide"><h3>December</h3></div>

                        </div>
                        <!-- Add Pagination -->

                        <!-- Add Arrows -->
                        <div id="swiperNext" class="swiper-button-next"></div>
                        <div id="swiperPrevious" class="swiper-button-prev"></div>
                    </div>

上面是我加载到滑块中的月份列表，它可以作为一个滑块。这些是滑动按钮（基本上是div标签）：

   <div id="swiperNext" class="swiper-button-next"></div>
    <div id="swiperPrevious" class="swiper-button-prev"></div>

我在jquery中创建了点击事件，如下所示：

 $('#swiperNext').click(function(e)
   {
      alert('Next button pressed');
   });
   $('#swiperPrevious').click(function(e)
   {
       alert('Previous button pressed');
   });

现在我应该在滑块（月份名称）中获取当前值并将滑块中的值传递给JS onclick函数，然后将其传递到我的PHP函数中......有人可以点我在正确的方向？

谢谢！

Answer 1

在文档中找到了这个： swiper-slide-active是当前活动元素的类名，因此：

$('.swiper-slide-active').html()无效

但$('.swiper-slide-active h3').html()确实有效。

（http://idangero.us/swiper/api/#.V0f-6L52OPs）

Answer 2

在这些情况下，我通常会将一个活动类添加到活动节点：

<div class="swiper-slide active"><h3>January</h3></div>

我使用活动选择器（使用jQuery）获得当前滑块：

activeElement= $(".swiper-wrapper .active");

现在，当我想要显示下一个值时，我隐藏了activeElement并显示了下一个元素并从activeElement中删除了活动类并添加到下一个。

activeElement.hide();
nextElemtn = activeElement.next();
nextElemtn.show();
nextElemtn.addClass("active");

或

activeElement.hide();
prevElemtn = activeElement.prev();
prevElemtn.show();
prevElemtn.addClass("active");

你可以得到这样的html活跃值：

activeElementHtml = activeElement.html()

当元素是第一个和最后一个子元素时，有一些例外，您可以从jquery

中的索引访问它

indexElement = activeElement.index()

例如当index为0时，prev不可能，或者在最后一个子节点不可能进行下一次调用。你可以获得长度为jQuery的元素总数

lengthElements = $(".swiper-wrapper").children('div').length;

你应该将活动类添加到第一个元素，如下所示：

<div class="swiper-slide active"><h3>January</h3></div>

访问div标签的值

2 个答案: