javascript - JQuery - get(0) 未定义

Question

我有这个 HTML 结构:

<div id="navigation">
    <div id="accordion">
        <!-- 1st header and pane -->
        <img src="horisontalTabsAccordion/images/button1.jpg" />
        <div style="width:200px; display:block"><h3>Apolonija, zubarska ordinacija</h3><p>Nesto pise malo vise malo manje :)</p></div>

        <!-- 2nd header and pane -->
        <img src="horisontalTabsAccordion/images/button2.jpg" />
        <div><h3>Apolonija, zubarska ordinacija</h3><p>Nesto pise malo vise malo manje :)</p></div>

        <!-- 3rd header and pane -->
        <img src="horisontalTabsAccordion/images/button3.jpg" />
        <div><h3>Apolonija, zubarska ordinacija</h3><p>Nesto pise malo vise malo manje :)</p></div>

        <!-- 4th header and pane -->
        <img src="horisontalTabsAccordion/images/button4.jpg" />
        <div><h3>Apolonija, zubarska ordinacija</h3><p>Nesto pise malo vise malo manje :)</p></div>
    </div>
    <div id="buttons">
        <a href="#" class="btn-prev"><div class="previous-icon"></div></a>
        <a href="#" class="btn-next"><div class="next-icon"></div></a>
    </div>
</div>

我正在尝试添加用于激活当前选项卡的下一个和上一个选项卡的按钮。当前的图像元素具有“当前”类。

我写的JS有这样的形式:

$(document).ready(function(e) {
var currentTab = $('#accordion').find('img.current');

$('.btn-prev').bind('click', function(){
    currentTab.prev('img').get(0).click();
    console.log("Previous");

    return false;
});

 $('.btn-next').bind('click', function(){
    currentTab.next('img').get(0).click();
    console.log("Next");

    return false;
});

});

我有错误提示 get(0) 未定义。 - 类型错误:currentTab.prev("img").get(0) 未定义

Answer 1

.prev 获取前一个元素 IF 它匹配选择器，而不是前一个元素 THAT 匹配选择器。

试试这个:

currentTab.prevUntil('img').prev().get(0)

.next() 需要与 .nextUntil

相同的处理方式

你还应该做一些检查，以防止当你在第一个时按上一个错误。