0

我对一些定制的轮播逻辑有一些问题。

我需要在我的页面上处理两个事件。当用户按下左键时，我希望选择器成为活动对象的前一个对象。当用户按下右时，活动项目应该在“活动”项目旁边。

这是html

<li><a href='/vaara'><img src="/media/954/150.jpg" alt="blabla"/></a></li> 
<li><a href='/vaara'><img src="/media/954/150.jpg" alt="blabla"/></a></li>
<li><a href='/vaara'><img src="/media/954/150.jpg" alt="blabla"/></a></li>

中间的元素代表“活跃”的元素。

这是我想出的jquery

var activeitem = $("#carousel_ul li:eq(3) a img", this).attr('alt');

现在我只想获取 prev() 或 next() 替代文本。像这样的东西

carouselItemLeft.on('click', function () {
                    var connectedInsurace = activeitem.next();
4

4 回答 4

1

eq是从零开始的，因此选择标记中不存在:eq(3)的第三个元素并返回. 是 jQuery 对象的方法而不是 String 对象，并且在您的代码中导致.liattrundefinednextReferenceError

于 2013-02-19T14:46:47.683 回答
1

.next()看着下一个兄弟姐妹。您当前的上下文是一个图像，您想要的“下一个”图像是一个包含在列表项和锚点中的图像，因此您需要类似：

var next = activeItem.closest("li").next().find("img").attr("alt");
于 2013-02-19T14:48:09.800 回答
0

您应该命名变量以反映它们的实际含义。activeitem不应该存储到alt项目的属性，它应该存储实际项目。

假设当前活动li元素有一个名为 的类active。那么您的代码可能如下所示：

carouselItemLeft.on('click', function () {
    var $activeitem = $("#carousel_ul li.active"); // the li, not the img
    var $connectedInsurace = $activeitem.next();
    var alttext = activeitem.find('img').attr('alt');
于 2013-02-19T14:44:10.693 回答
0

您最好将 data-* 标签实际分配给活动项目，而不是在项目上使用索引。

所以：

carouselItemLeft.on('click', function () {
      var $connectedInsurace = $('[data-active="true"]');
      $connectedInsurace.data("active", false);
      $(this).data("active", true);

     // Get next item
     var $next = $connectedInsurace.next();
});
于 2013-02-19T14:51:22.337 回答